применить значения входов ко всем его тд innerhtml - PullRequest
Новая
       17

применить значения входов ко всем его тд innerhtml

3 голосов
/ 07 января 2012

возможно ли изменить innerhtml всего тд, когда он имеет вход внутри, я имею в виду взять значение ввода и применить его к его тд innerhtml, например, вот таблица и ее ввод внутри:

<table>
 <tr>
  <td><input value="test" /></td>
  <td>123</td>
 </tr>
</table>

, чтобы изменить что-то на это: 

<table>
 <tr>
  <td>test</td>
  <td>123</td>
 </tr>
</table>

для всех значений td и input без применения идентификаторов и классов ?!пожалуйста, обратите внимание, что td innerhtml не изменился :) спасибо всем за помощь!;)

Ответы [ 3 ]

5 голосов
/ 07 января 2012

Это довольно легко.

Сначала назовите свою таблицу (чтобы ее было легко найти). 

<table id="the_table">
 <tr>
  <td><input value="test" /></td>
 </tr>
</table>

Тогда вы можете сделать это: 

$('#the_table td input[type="text"]').each(function() {
  var val = $(this).val();
  $(this).parent('td').html(val);
});

Живая демоверсия .

Пояснение:

  1. найти все входные данные, которые находятся в <td>, которые находятся в этой определенной таблице.

  2. для каждого входа:

    2.1 получить значение из ввода

    2.2 найдите первого родителя ввода, который является тегом <td>, и установите для его innerHTML значение

4 голосов
/ 07 января 2012

Да, вы можете сделать это следующим образом: 

$('table td:has(:input:only-child)').each(function () {
    $(this).html($(':input', this).val());
});

Предполагается, что в td есть только input.Если это не так, тогда удалите :only-child.

Объяснение table td:has(:input:only-child)

В нем говорится, возьмите любой td в пределах table,*

, который имеет input в качестве единственного ребенка. Вы можете проверить это здесь: http://jsfiddle.net/eydtw/

Обновление: возьмите input, который не hidden. 

$('table td:has(input[type!="hidden"])').each(function () {
    $(this).html($('input[type!="hidden"]', this).val());
});

http://jsfiddle.net/eydtw/1/

или: взять input, что составляет text. 

$('table td:has(input:text)').each(function () {
    $(this).html($('input:text', this).val());
});

http://jsfiddle.net/eydtw/3/

1 голос
/ 07 января 2012 
$.each($('table td'),function(){

    if($(this).children().length !=0)
    {

        var temp = $($(this).children()[0]).val();
        $(this).html(temp);

    }

})
...