jQuery фильтрация динамического содержимого html

Я загружаю шаблон HTML с помощью функции $.get, и я хотел бы проанализировать этот HTML-код и ввести в него свои собственные значения. До сих пор я пробовал приведенный ниже фрагмент, но он, похоже, не работает.jQuery фильтрация динамического содержимого html

$.get('/js/dynamic/locations', function(newRow) { 
    var existing_elem = $('.edit-table tr:last'); 
    existing_elem.after(newRow); 
    var appendedRow = existing_elem; 
    appendedRow.find('td[data-th="Name"] > span').text(v.location_name); 
    appendedRow.find('input').val(v.location_name); 
    appendedRow.effect("highlight", {color: '#CCB4A5'}, 1000); 
});

Значение NewRow при загрузке является:

<tr> 
    <td data-th="Name"><span class="edit-input-text"></span> 
    <input class="inp input-edit" type="text" name="location_name" value=""></td> 
</tr>

источник

2015-07-01 V4n1ll4

Что такое значение 'v.location_name' и как вы присоедините HTML в DOM? –

Прежде всего, вы должны добавить загруженное содержимое в DOM. Затем выбрать и отредактировать любой элемент, который вы хотите:

EDIT (# 2)

HTML (Assumung это HTML загружен: 2 колонки)

<tr> 
    <td data-th="Name"><span class="edit-input-text"></span> 
    <input class="inp input-edit" type="text" name="location_name" value=""> </td> 
    <td data-th="LastName"><span class="edit-input-text"></span> 
    <input class="inp input-edit" type="text" name="location_name" value=""> </td> 
</tr>

JQuery

$.get('/js/dynamic/locations', function(newRow) { 
    var existing_elem = $('#existing_elem'); 
    //Append the html  
    existing_elem.append(newRow); 
    //Select the appended html 
    var appendedRow = existing_elem.children('tr'); 
    //Select eny elem inside the appended html 
    appendedRow.addClass('appended'); 
    appendedRow.find('td[data-th="Name"] > span').text('your_text'); 
    appendedRow.find('input').val('new_value'); 
    //Second column 
    appendedRow.find('td').eq(1).find('input').val('another_value'); 
});

источник

2015-07-01 10:06:15 kapantzak

Кажется, что это работает, но как бы изменить его, если я хочу изменить несколько элементов в строке HTML? – V4n1ll4

Например, если в моей таблице было несколько столбцов, и я хотел изменить другой диапазон, как бы связать это вместе? – V4n1ll4

см. Мое редактирование выше. Я изменил код, чтобы отразить ваши предложения. Однако мне пришлось немного изменить селектор, и теперь он не работает. – V4n1ll4

Вы пытались:

$(newRow).find('.edit-input-text').text(v.location_name);

Working demo

//Create a jQuery object from your ajax response 
var newRow = $('<tr><td data-th="Name"><span class="edit-input-text"></span><input class="inp input-edit" type="text" name="location_name" value=""></td></tr>'); 

//Manipulate 
newRow.find('.edit-input-text').text("I am new here") 

//Do whatever 
$('#demo').append(newRow);

источник

2015-07-01 10:10:21 lshettyl

Я думаю, что ваш селектор имеет проблему. Попробуйте это -

$.get('/js/dynamic/locations', function(newRow) { 
    $(newRow).filter('tr td[data-th="Name"] span').text(v.location_name); 
});

где селектор 'tr td[data-th="Name"] span' следует отметить, ИЛИ

$.get('/js/dynamic/locations', function(newRow) { 
    $('[data-th="Name"]', newRow).find('span').text(v.location_name); 
});

источник

2015-07-01 10:11:48 Krishna

jQuery фильтрация динамического содержимого html

ответ

Смежные вопросы