Onclick方法在javascript中动态创建按钮


onclick method to dynamically created button in javascript

我正在使用jquery-mobile包开发基于web的移动应用程序。从一个php脚本,我读取按钮id从MySQL和发送id到JavaScript方法来创建一个按钮。然而,我想添加onclick listener也,当然,但我不能管理它。请帮忙。

<div data-role="content2" >
    <script type="text/javascript">
        function createButton(n) {
            $('[data-role="page"]').append('<button  data-theme= "b" id="btnInit' + n + '" >' + n + '</button>');// here I want to add onclick listener
        }
    <?php
        include './_fonksiyon.php';
        $query = ("
            SELECT
                tbl_ustmenu.Id AS id,
                tbl_ustmenu.AdiT AS adi
            FROM tbl_ustmenu
            WHERE tbl_ustmenu.Aktif=1
            AND   tbl_ustmenu.UstMenuId=0
            ORDER BY tbl_ustmenu.Sira ASC
                                    ");
        $result = mysql_query($query);
        $count = 0;
        while ($count < mysql_num_rows($result)) {
            $i = (mysql_result($result,$count, ($id)));
            $count++;
        ?>
            createButton(<?php echo ($i) ; ?>);
        <?php
        }
        ?>
    </script>
    </div>

用下面的代码段替换您的createButton,或者使用相同的代码段创建一个单独的函数。

<script type="javascript">
    var button = document.createElement("INPUT");
    button.type = "button";
    button.name = "button";
    button.value = "Click me";
    button.id = "<?php echo $i ?>";
    button.onclick = function() {
        // ...
        // function body
    };
    // you may append it to any element you need
    document.body.appendChild(button);
</script>

先将按钮保存为一个变量,这样更易读

var btn = $('<button  data-theme= "b" id="btnInit' + n + '" >' + n + '</button>');
btn.click(function() {
    alert('here we go');
});
$('[data-role="page"]').append(btn);

为您的按钮添加一个类,并在单击时创建绑定,如下所示:

$('[data-role="page"]').append('<button  class="mybuttonclass" data-theme= "b" id="btnInit' + n + '" >' + n + '</button>');

$(".mybuttonclass").on("click",function(e){
    //..
});