Question

我正在使用jquery-mobile软件包来开发基于Web的移动应用程序。从php脚本我读取MySQL的按钮id并将id发送到JavaScript方法为它创建一个按钮。但是我还想添加onclick监听器，但是我无法管理它。请帮忙。

<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>

Answer 1

将您的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>

Answer 2

在按钮中添加一个类并在点击时创建一个绑定，如下所示：

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



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

Answer 3

首先将按钮保存到变量，它的可读性更高

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

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

3 个答案: