Question

当我通过JQuery和PHP按下某个按钮时，我想做点什么。但问题是，我页面上的按钮是动态生成的，所有按钮都有不同的值。所以它可以是三个，四个按钮，等等。

两个主要问题是：

1）只有第一个按钮被Javascript识别，另一个没有做任何事情。

2）我找不到用JavaScript将变量id传递给我的PHP代码的方法。

一个例子有望使问题清楚：

HTML，按钮数量未知，均具有不同的值：

<button id='button' value='$variableid1'>Do something</button>
<button id='button' value='$variableid6'>Do something</button>
<button id='button' value='$variableid11'>Do something</button>
...

按下后，我尝试激活此Javascript代码：

 $(document).ready(function() {
   $("#button").click(function() {
    $.ajax({
        type:"POST",
        data: {clicked: ?},
        });
    });

});

PHP代码，在同一页面上：

if(isset($_POST['clicked'])){

//do some stuff with the variable id.

}

Answer 1

ID必须是唯一的，您应该使用类，而对于动态生成的元素，您应该委派事件：

$(document).on('click', '.button', function(e) {
   // e.preventDefault();
   $.ajax({
       type:"POST",
       data: {clicked: this.value},
   }).done(function(data){
       console.log(data, 'done');
   });
});

Answer 2

这是错误的，你不能为多个元素拥有相同的id。您需要为每个元素提供唯一ID。你可以拥有相同的课程，但身份不同。

Answer 3

您可能想尝试这样来获取这些值：

让元素具有相同的类和唯一ID
使重复的按钮具有相同的类，例如按钮，例如 <button class='button' value='<?php echo $variableid1 ?>'Do something</button>

然后使用jquery，你可以像这样访问每个按钮的值：

$(".button").live('click',function(){    
var valueofbutton = $(this).val();    
alert(valueofbutton);//also put your ajax function here...   
})

请注意使用'live'。

Answer 4

这里有很多错误，很难知道从哪里开始

<button id='button' value='$variableid1'>Do something</button>
<button id='button' value='$variableid6'>Do something</button>
<button id='button' value='$variableid11'>Do something</button>

如上所述，id在页面上必须是唯一的，它们是html元素的后续键，而不仅仅是装扮。

所以

<button id='button1' value='$variableid1'>Do something</button>
<button id='button2' value='$variableid6'>Do something</button>
<button id='button3' value='$variableid11'>Do something</button>

如果要将脚本变量中的值加载到“值”，则需要执行此操作

<button id='button1' value='<?php echo $variableid1; ?>'>Do something</button>
<button id='button2' value='<?php echo $variableid6; ?>'>Do something</button>
<button id='button3' value='<?php echo $variableid11; ?>'>Do something</button>

或者，如果您在php上打开了短标签

<button id='button1' value='<?=$variableid1?>'>Do something</button>
<button id='button2' value='<?=$variableid6?>'>Do something</button>
<button id='button3' value='<?=$variableid11?>'>Do something</button>

如果您想知道在按下按钮时需要处理表单数据的php脚本中按下了哪个按钮给他们一个名字。

<button id='button1' name='buttons1' value='<?php echo $variableid1; ?>'>Do something</button>
<button id='button2' name='buttons2' value='<?php echo $variableid6; ?>'>Do something</button>
<button id='button3' name='buttons3' value='<?php echo $variableid11; ?>'>Do something</button>

现在能够在jQuery中搜索一组东西的一种方法是给它们一个可以在jQuery中使用的类名，但不需要是一个真正的css类。因此，我们使用像'jq-butset'这样的描述性名称。

<button id='button1' class='jq-butset' name='buttons1' value='<?php echo $variableid1; ?>'>Do something</button>
<button id='button2' class='jq-butset' name='buttons2' value='<?php echo $variableid6; ?>'>Do something</button>
<button id='button3' class='jq-butset' name='buttons3' value='<?php echo $variableid11; ?>'>Do something</button>

所以现在你的jQuery代码可能看起来像这样

$(document).ready(function() {
   $(".jq-butset").click(function() {
      posting = $.post('url/to/the/phpscript/to/run/test.php',
                   { buttonname: $(this).attr('name'), 
                     buttonvalue: $(this).attr('value')
                   }
       );
       posting.done( function (data) {
        ... do something with the data returned
       });
       posting.error( function () {
         .. do something if an error occurs
       });
    });
   });
});

通过JQuery获取多个按钮的值

4 个答案: