Question

我有一些根据存在的电话号码动态创建的按钮。假设我在DB中有3个名字，所以会有三个按钮。所以当我点击第一个按钮然后它应该给出值第一个按钮，如果点击第二个，那么第二个按钮值应该显示。这很简单jsfiddle描述了我的要求。我想为每个按钮分配一个不同的id应该是电话号码。在jsfiddle当我我点击一个特定的按钮然后提醒弹出，但它没有给出任何价值。

我确实喜欢这个

$('.btn').click(function(){ 
var number1 = $('#s2').val();
alert(number1);
});

Answer 1

您必须使用jQuery's on() method使用事件委派。从其文档：

提供选择器时，事件处理程序称为委托。当事件直接发生在绑定元素上时，不会调用处理程序，但仅适用于与选择器匹配的后代（内部元素）。 jQuery将事件从事件目标起泡到附加处理程序的元素（即最里面到最外层的元素），并为该路径上与选择器匹配的任何元素运行处理程序。

在您的情况下，您需要将.btn点击事件委托给在该元素动态添加到页面之前存在的祖先：

$('body').on('click', '.btn', function() {
    var number1 = $('#s2').val();
    alert(number1);
});

越接近.btn元素越好，所以除非您的文档body是最近的非动态祖先，否则您需要将其更改为更接近的位置。< / p>

编辑：评论中的其他问题：

我可以获得每个按钮的ID

要获取每个按钮的id，只需使用this.id：

$('body').on('click', '.btn', function() {
    var id = this.id;
    alert(id);
});

编辑2：评论中的进一步问题

正如我所说，ID是数字。所以如果我点击button1然后它会在输入字段中打印s1。你能告诉我该怎么做吗？

由于您的input的号码为id，您只需使用jQuery的.val()方法将input的值设置为id点击按钮：

$('body').on('click', '.btn', function(){ 
    $('#number').val(this.id);
});

Working JSFiddle demo

Answer 2

$(document).on('click', '.btn', function(){ 
   alert($(this).val()); 
});

应该有效。 “on”是一种使用动态放置元素的方法。

Answer 3

将值属性放在按钮输入

中

  <button type="button" class="btn" value="test2" >test</button>
  <button type="button" class="btn" value="test1" id="s1">test</button>
  <button type="button" class="btn" value="test" id="s2">test</button>

然后使用脚本

 $('.btn').on('click', function() {
       var number = $('#s2').val();//get value

 });

Answer 4

如果您想获得点击按钮的ID，请使用attr：

$('.btn').click(function(){ 
   var number1 = $('#s2').attr('id');
   alert(number1);
});

如何从点击按钮获取值

4 个答案: