Вызов функции с параметром в Jquery (по клику)
мне нужно вызвать функцию sendData, когда я нажимаю кнопку X у меня проблема с "" и '' не знаю, как правильно вызвать функцию
любая помощь
var txt1 = $(this).val() ;
var txt2 = $('<button type = "button" id = "'+txt1+'" class = "myButton"> '+txt1+' <button type = "button" onclick='sendData(txt1)'>X</button> </button>');
$("p").append(txt2); // Append new elements
Спасибо
Вы использовали одинарные кавычки вокруг sendData(txt1), что означает, что он находится за пределами строки. Вероятно, вы хотели использовать двойные кавычки, чтобы код был частью строки.
onclick = "отправитьДанные('+ txt1 +')"
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 5
Генерируемый вами htmlстрока имеет неправильный формат. Попробуйте следующее:
var txt1 = 'test';
var txt2 = $('<button type = "button" id = "'+txt1+'" class = "myButton"> '+txt1+' <button type = "button" onclick=sendData("'+txt1+'")>X</button> </button>');
$("p").append(txt2);
function sendData(data){
alert(data);
}<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p></p>Хотя я предпочитаю использовать Литералы шаблонов:
var txt1 = 'test' ;
var txt2 = $(`<button type = "button" id = "${txt1}" class = "myButton"> ${txt1} <button type = "button" onclick='sendData("${txt1}")'>X</button> </button>`);
$('p').append(txt2);
function sendData(data){
alert(data);
}<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p></p>Вы пропустили одну кавычку вокруг своей функции sendData -
Ваш -
var txt2 = $('<button type = "button" id = "' + txt1 + '" class = "myButton"> ' + txt1 + ' <button type = "button" onclick='sendData(txt1)'>X</button> </button>');
Правильный -
var txt2 = $('<button type = "button" id = "' + txt1 + '" class = "myButton"> ' + txt1 + ' <button type = "button" onClick='+sendData(txt1)+'>X</button></button > ');
FYI. Чтобы избежать проблем с одинарными или двойными кавычками, вы можете использовать функцию литералов шаблонов ES6 -
var txt2 = $(`<button type = "button" id = "${txt1}" class = "myButton">${txt1}<button type = "button" onclick=${sendData(txt1)}>X</button> </button>`);
Что ж, вы можете использовать возвращаемое значение создания кнопки и добавить к ней обработчик событий, чтобы использовать его для пересылки ваших данных в функцию sendData.
const inputField = $('<input type = "text" />');
const button = $('<button type = "button">Submit</button>');
$(button).on('click', function() {
sendData( inputField.val() );
});
function sendData( data ) {
console.info( data );
}
$('#container').append( inputField ).append( button );<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id = "container"></div>Try this
var txt1 = "a";
var txt2 = $('<button type = "button" id='+txt1+' class = "myButton"> '+txt1+' <button type = "button" onclick='+sendData(txt1)+'>X</button> </button>');
$("p").append(txt2); // Append new elements
function sendData(x)
{
console.info(x)
}<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p></p>Вы можете использовать обработчик события click, как показано ниже:
$(document).on("click", "#idOfButtonThatYouClicked" function() {
//do stuffs or call other functions
//var value = $("#someOtherPlace").value();
//sendData(value);
});
Подробнее здесь: http://api.jquery.com/on/
Не используйте встроенный JS. Вместо этого вы можете просто проверить всплывающее событие клика из
.myButton. Если вы все еще хотите использовать встроенный JS, это должно сработать:onclick = "sendData(' + txt1 + ')"