javascript不断循环

Question

从here继续...因为问题已经显着改变（在我看来）

这是我的代码

        for (var i = 0; i < len; i++) {
            (function () {
                var queryid = results.rows.item(i).id; //sql primary key
                var divid = "#" + queryid; //assigned id to divs
                var pressTimer;
                $(divid).mouseup(function(){ //func to handle tap + hold
                clearTimeout(pressTimer)
                // Clear timeout
                return false;
                }).mousedown(function(){
                // Set timeout
                pressTimer = window.setTimeout(function() {
                alert(divid);
                $(".somediv").show();
                $("#anotherdiv").hide();
                $("#button").on("click", function(){
                    var db = window.openDatabase("mydb", "1.0", "mydb", 200000);
                    db.transaction(editrow);    
                    function editrow(tx){
                        var value1 = $("#inputbox1").val();
                        var value2 = $("#inputbox2").val();
                        tx.executeSql("UPDATE mydb SET column1 = " + value1 + ", column2 = " + value2 + " WHERE id = " + queryid);
                        alert(divid); ********
                        successCB();} //query function
                })
                },1000)
                return false; 
                });
                })();
            }   

如果我单击 div 并编辑值，则它们已成功提交... 但是，如果之后我选择另一个 div 来更新其字段，那么新值将同时更新为选定的 div 以及先前选定的 div..

例如我选择 div1 并更新值一切正常

如果之后我选择 div2，那么 div1 和 div2 的值都会更新为 div2 的最新值

Answer 1

您不止一次绑定事件。在 div 上的每次 mousedown 中，您都将单击事件绑定到按钮。当您在 jquery 中调用“on”或“click”时，您并没有分配事件处理程序，而是添加一个处理程序。

我不明白您是否需要调用 setTimeout。

试试这个方法：

var lastClickedId = null;
function editrow(tx) {
    var value1 = $("#inputbox1").val();
    var value2 = $("#inputbox2").val();
    var queryid = lastClickedId;
    tx.executeSql("UPDATE mydb SET column1 = " + value1 + ", column2 = " + value2 + " WHERE id = " + queryid);
    alert(queryid);
    lastClickedId = null;

    successCB();
} //query function

$("#button").on("click", function(){

    if(lastClickedId != null)
    {
        var db = window.openDatabase("mydb", "1.0", "mydb", 200000);
        db.transaction(editrow);
    }
});

for (var i = 0; i < len; i++) {

    (function () {
        var queryid = results.rows.item(i).id; //sql primary key
        var divid = "#" + queryid; //assigned id to divs

        $(divid).click(function(){
            lastClickedId = queryid;
        });
    })();
}

更新：

当你使用 bind(func)、on(func)、click(func) 等在 jquery 中绑定元素时，你是注册函数 func 以在事件发生时调用。您可以注册任意数量的功能。因此，例如，如果您这样做：

$("#div1").on("click", function() { alert("hello"); });
$("#div1").on("click", function() { alert("world"); });

点击时会显示两个警报。这是因为 jquery 管理事件的方式。它会调用您在事件中传递的每个函数。

要使用 on 分离您附加到该元素（或多个元素）的所有点击事件，只需执行以下操作：

$("#div1").off("click");

在“纯”javascript 中，您可以这样做：

var div1 = document.getElementById("div1");

div1.onclick = function() { alert("hello"); };
div1.onclick = function() { alert("world"); };

在第二个示例中，只会调用一个警报，因为您直接为函数 onclick 分配了一个值。 并删除事件：

div1.onclick = null;