4

大家好，我假设我的移动应用程序中有两个 html 文件，分别是 page1.html 和 page2.html。在 page2.html 中，我有一个表，单击行时，我显示了一个警报。如果假设我从 page1 转到 page2.html，那么在单击表时它会显示一次警报框。如果我按下返回按钮然后它会转到 page1.html 如果假设我再次转到 page2.html 并单击表格行，那么这次警报显示 2 次。如果我再次返回 page1 并再次访问 page2.html 那么这次单击行时会显示警报 3 次，依此类推...

我的 page2.html 表如下所示：

<div id="myTable"  align="center"  data-theme="b"></div>
        <script type="text/javascript"> 

var theader = '<table border="1" id=\"tableId\">\n';

                    var colheader = '<tr id="headingtab" bgcolor="#D68B8B"><th>Name</th><th>Address</th><th>City</th><th>LTP</th><th>State</th><th>Country</th><th>Mob No</th></tr>\n';
                    tbody = colheader; 


                    tbody += '<td>';
                        tbody += "QQQQQQQQQQQQQQQQQQQQQ";
                        tbody += '</td>';

                        tbody += '<td>';
                       tbody += "QQQQQQQQQQQQQQQQQQQQQ";
                        tbody += '</td>'

                        tbody += '<td>';
                        tbody += "QQQQQQQQQQQQQQQQQQQQQ";
                        tbody += '</td>'

                        tbody += '<td>';
                       tbody += "QQQQQQQQQQQQQQQQQQQQQ";
                        tbody += '</td>'

                        tbody += '<td>';
                        tbody += "QQQQQQQQQQQQQQQQQQQQQ";
                        tbody += '</td>'

                        tbody += '<td>';
                        tbody += "QQQQQQQQQQQQQQQQQQQQQ";
                        tbody += '</td>'

                        tbody += '<td>';
                        tbody += "QQQQQQQQQQQQQQQQQQQQQ";
                        tbody += '</td>'                             


                        tbody += '</tr>\n';

                        var tfooter = '</table>';
                        document.getElementById('myTable').innerHTML = theader + tbody + tfooter;

                        </script>


 <script type="text/javascript">


            $("#tableId tr td").live("click",function()
            {    
                console.log("??????????????????????????????");

                alert("Row Click");

            });


    </script>
    </div>

我希望每次点击只显示一个时间警报。怎么做？任何帮助将不胜感激。提前致谢。

4

4 回答 4

2

使用 jquery 函数 .one()

$(#tableId tr td).one("click",function()
            {    
                console.log("??????????????????????????????");

                alert("Row Click") 
}

检查这个

这可能会帮助你

于 2012-08-21T08:49:54.850 回答
0

试试这个

  $("#tableId tr td").click(function()
        {    
            console.log("??????????????????????????????");

            alert("Row Click");

        });

编辑 小提琴

于 2012-08-21T08:47:30.130 回答
0

由于每次加载 page2.html 时都会绑定该事件处理程序，因此会出现此问题。我猜这个页面是用 Ajax 加载的？这意味着每次加载页面时都会添加事件处理程序，并且由于它是 Ajax，JavaScript 事件处理程序仍然存在。事件处理程序一直存在，直到您将它们自己删除以重新加载完整的页面。

最好的解决方案是只在基本页面（执行所有 ajax 加载的页面）中添加一次事件处理程序。

另一种解决方案是首先取消绑定旧的事件处理程序并添加新的事件处理程序。

$("#tableId tr td").unbind('click').live('click'.....

更好的是使用 jQuery 的委托方法：

$("#tableId").die('click', 'tr td').live('click', 'tr td'.....
于 2012-08-21T08:51:51.333 回答
0

如果我e.stopImmediatePropagation();用作：

$("#tableId").die('click', 'tr td').live('click', 'tr td', function (){
            alert ("Click");
            e.stopImmediatePropagation();

            });

然后它给了我正确的结果，但是如果我使用 `e.stopPropagation(); 那么它是行不通的。

顺便说一句，谢谢你们fredrik,Ashirvad Singh,Arjun T Raj 的时间和回复。任何其他建议将不胜感激。谢谢。

于 2012-08-21T12:33:08.293 回答