как передать текстовые значения их родительскому и родственному div. используя jquery

Мне нужно выбрать все значения из следующих полей ввода в соответствующие им div. См. ниже

<div id='table_row_div'>
  <div id='txtbox'><input type=text name='from' value='<?php echo $someVal?>'></div>
  <div id='splited'>
    <div new="0"><div>i want text's splited value here</div>
    <div new="1"><div>i want text's splited value here</div>
    <div new="2"><div>i want text's splited value here</div>
  </div>
</div>

Эти входные текстовые поля содержат значения типов (1,0,0), (0,1,1), (1,0,1)... Приведенный выше блок примерно 49 раз... и мне нужна автоматизированная система, которая разбивает текстовое значение и вставляет только «один» символ в каждый следующий div attr(new);

как я могу сделать это с помощью jquery. я пробовал следующий тип кода..

var inputVal = $("#table_row_div #txtbox input");
var arrayFromDB = inputVal.val().split(',');


inputVal.closest('div').closest('div').find('div[new~="0"]').text(arrayFromDB[0]);
inputVal.closest('div').closest('div').find('div[new~="1"]').text(arrayFromDB[1]);
inputVal.closest('div').closest('div').find('div[new~="2"]').text(arrayFromDB[2]);

Но это не работает...


arrays jquery closest
person MFarooqi    schedule 10.05.2011    source источник
comment
Если этот блок повторяется много раз, вы создаете крайне недопустимый XHTML. ID следует использовать один раз и только один раз.   -  person Town    schedule 11.05.2011

Ответы (2)


arrow_upward
1
arrow_downward

Прежде всего — не используйте ID более одного раза. Идентификаторы разработаны, чтобы быть уникальными.

Измените свои IDs для классов, если они не будут уникальными.

Вы можете реализовать необходимое решение следующим образом:

HTML

<div class='table_row_div'>
    <div>
        <input type='text' class='txtbox' name='from' value='<?php echo $someVal?>'>
    </div>
    <div class='split'>
        <div new="0">First split value</div>
        <div new="1">Second split value</div>
        <div new="2">Third split value</div>
    </div>
</div>

JQuery

$('.txtbox').each(function() {
    var arrayFromDB = $(this).val().split(',');
    var splitDiv = $(this).closest('.table_row_div').find('.split');
    $('div[new~="0"]', splitDiv).text(arrayFromDB[0]);
    $('div[new~="1"]', splitDiv).text(arrayFromDB[1]);
    $('div[new~="2"]', splitDiv).text(arrayFromDB[2]);
});

Рабочая демонстрация на jsfiddle.net.

person Town    schedule 10.05.2011
comment
@Town.. красиво.. отлично.. .действительно помогло.. мило... - person MFarooqi; 11.05.2011

arrow_upward
1
arrow_downward

Это может помочь, если вы правильно закроете теги div с «новым» атрибутом.

person kei    schedule 10.05.2011
comment
На самом деле я написал эти коды только для того, чтобы показать метод, который я использую. Фактический код достаточно длинный... :) - person MFarooqi; 11.05.2011