Я создал таблицу и заполнил ее с помощью jQuery. Теперь я хотел бы добавить текст, например, когда мы нажимаем на него, функция выполняется. Я использовал onclick
, и он работал нормально, но мне также нужно отправить несколько аргументов в мою функцию, как я могу отправить аргументы целевой функции из onclick
:
var dataHtml = '';
$.each(data, function (index, user) {
dataHtml+ = "<code onclick=show_popup(1,user['donner'][0])> Donner details</code>";
});
$("#t-data").html(dataHtml);
function show_popup(show=0, donner){
$(document).ready(function(){
var showModel=show;
if (showModel==`1`){
$(`#modal-default-admin`).modal(`show`);
}
});
Но он показывает ошибку «пользователь не определен». Пользователь определен, и я также могу получить к нему доступ.
Кроме того, модель != модальный
user
на самом деле не определено. Проблема, с которой вы столкнулись, заключается в том, что вы используете HTML как строку, поэтому вы предоставляете onclick=show_popup(1,user['donner'][0])
как строку. Когда jQuery «создает HTML» из этой строки, и вы нажимаете на нее, он вызывает show_popup
с 1
и user['donner'][0]
, а user
здесь не определено. Он был доступен только внутри цикла $.each
, а не за его пределами.
Самое простое решение — передать значение напрямую, а не пытаться сделать это как указатель.
onclick=show_popup(1,\""+ user['donner'][0] +"\")>
Таким образом, он будет использовать ценностьuser['donner'][0]
при создании HTML.
Бонус: вы должны заключить атрибут onclick в кавычки:
dataHtml += "<code onclick='show_popup(1,\""+ user['donner'][0] +"\")'> Donner details</code>";
Просто чтобы убедиться, что, например, пробел в значении user['donner'][0]
не сломает его снова.
после этого отображается ошибка Uncaught SyntaxError: Неожиданный идентификатор. Если я не передам пользователя ['donner'], тогда появится всплывающее окно
Я обновил фрагмент, у меня было больше пропущенных кавычек
dataHtml+ = "<code onclick=show_popup(1,'{{user['donner'][0]}}')> Сведения о доннере</code>"
@JakubKotrs Это сработало.!! Но есть проблема, что он фактически печатает объект как строку. Я изменяю этот объект на индексированный массив, используя это: var result = Object.keys(user['donner'][0]).map((key) => [key, user['donner'][0][key]]);
, но он преобразует это в строку в формате KEY, VALUE, KEY, VALUE, KEY..... Как я могу передать его так, чтобы он оставался массивом
@JakubKotrs Я создал переменную JS, строковую HTML-таблицу со всей информацией о доннере, а затем просто передал ее, чтобы показать доннер и использовать ее. Это работало нормально. Спасибо
Вероятно, сейчас самое время сказать вам, что использование строки для создания HTML-элементов, подобных этому, в долгосрочной перспективе не является хорошей идеей. Вы должны рассмотреть более программный подход. В jQuery вы можете сделать $('<code />').on('click', () => show_popup(1, user.doner[0]))
просто отлично. Это создает новый элемент кода и подключает прослушиватель событий. Затем вы можете добавить текстовое содержимое, используя .text('content')
и так далее.
var showModel=show;
является избыточным.