4

これは私のHTMLとPHPコードです

Colorbox がうまく機能しており、ボタンも表示されています。

//This is the Colorbox code
<div style="display: none">
<div id="remove">
    <h1>Are you sure you wish to remove this product</h1>
    <h2>Enter Captcha below to confirm</h2> //Just a Captcha-like behavior
    <input type="text" value="<?php echo $captcha_value; ?>" id="display" readonly ><br /> <br>
    <input type="text" name="captcha" value="" id="input" maxlength=6/> <br> <br>
</div>
</div>

//To Display all products
<?php foreach ($products as $product) { ?>
<td>
   <div>
     <img src="<?php echo $product['image']; ?>"/>
   </div>
   <div>
     <a onClick="loadColor(<?php echo $product['opv_id']; ?>)" class="remove-item">
       <img src="<?php echo $product['product_remove_image']; ?>"/>
     </a> //To know which product's link was clicked
   </div>
</td>
<?php } ?>

//loadColor function which will append a button to Colorbox
<script type="text/javascript">
function loadColor(opv_id) { //To create a button and append to the colorbox and call colorbox
  $('#remove-product').remove();
  string = '<button value="' + opv_id + '" id="remove-product">Submit</button>';
  $(string).appendTo('#remove');
  jQuery.colorbox({inline: true, href:"#remove", width:"50%"});
}
</script>

<script type="text/javascript">
$('#remove-product').click(function() {
  alert('Clicked');
  //Do something here!!
})
</script>

とった :)

それで、私が上でやろうとしたことを達成するための他の簡単な方法はありますか?

4

1 に答える 1

4

動的に追加された要素には、イベント委任を使用する必要があります。

$('#remove').on("click", '#remove-product', function () {
    alert('Clicked');
    //Do something here!!
});

ドキュメントを確認する

于 2013-04-24T05:13:17.403 に答える