javascript按钮点击功能不起作用

javascript button click function not working

本文关键字：功能 不起作用 按钮 javascript      更新时间：2023-09-26

我有一个网站，用户可以在其中选择一个项目，然后显示详细信息，包括数量。我还在div中包含了一个按钮，这样当单击时，它应该会将数量减少1。

        $("#btnBuy1").click(function()
        {
            if (!sessionStorage['quantity1'])
            {
                sessionStorage['quantity1']=1;
            }
            else
            {
                sessionStorage['quantity1']++;
            }
            $("#dropbox").html('<div id = "1"><img class = "thumb" id = "t1" src="../images/birthday_metoyou.jpg" />' + teddy[1].desc + ", Price £"
             + teddy[1].price + ", Quantity: " + sessionStorage.getItem('quantity1') + "<button id = 'btnRemove1'>Remove</button></div><br/>");
            updateBasket();
            sessionStorage["total1"] = parseInt(sessionStorage.getItem('quantity1')) * teddy[1].price;
            updateSubtotal();
            if (Modernizr.sessionstorage) 
            {  // check if the browser supports sessionStorage
                myids.push(teddy[1].partnum); // add the current username to the myids array
                sessionStorage["ids"]=JSON.stringify(myids); // convert it to a string and put into sessionStorage
            } 
            else 
            {
             // use cookies instead of sessionStorage
            }            
        });
$("#btnRemove1").click(function()
{
   alert(remove);
});

我输入了一条警告消息，看看按钮是否正常工作，但当我单击btnMove1按钮时，什么也没发生。

由于按钮是动态添加的，您可以尝试一下吗：

$(document).on('click', '#btnRemove1', function() {
{
   alert("remove"); //I dont know what remove was is the example, added quotes around it.
});

这是因为按钮是稍后添加的(动态(。您必须使用委托。

你不必为此动用身体。任何非动态插入的元素，如果是#btnMove1的父元素，都可以。

$('body').on('click','#btnRemove1',function(){
   alert(remove);
});

原因是您在页面上出现#btnMove1元素之前绑定了事件。因此，没有任何东西可以将事件绑定到。但是，body元素-将出现在页面上，并将您的事件委托给#btnMove1。

您可以将事件绑定到文档(jQuery live在被弃用之前曾做过的事情(

现在是：

$(document).on("click", "#btnRemove1", function(){})

或者您可以在#btnMove1添加到Dom后重新绑定该事件。

在尝试将点击事件附加到DOM之前，您的Remove按钮很可能不在DOM中。从代码片段中很难判断，但如果Buy按钮操作没有成功完成，那么Remove将不存在。

在将单击事件附加到Remove时，请尝试控制台日志记录$("#btnRemove1"(.length以查看它是否存在，或者使用断点。

对代码的改进是缓存在变量$("#dropbox"(中，然后在其中查找按钮，如：

var $dropBoxNode = $("#dropbox");
$dropBoxNode.find("#btnRemove1");

您应该使用.on((而不是不推荐使用的.click((.

在创建删除按钮后，尝试添加删除按钮点击处理程序

///Code snippit
$("#dropbox").html('<div id = "1"><img class = "thumb" id = "t1" src="../images/birthday_metoyou.jpg" />' + teddy[1].desc + ", Price £"
                     + teddy[1].price + ", Quantity: " + sessionStorage.getItem('quantity1') + "<button id = 'btnRemove1'>Remove</button></div><br/>");
$("#btnRemove1").click(function()
{
     alert(remove);
});
updateBasket();
///Code snippit

$('a.edit').on('click','a.edit',function(){
   if (confirm("Are you sure you want to Edit this Photo?"))
   {
    ....
    ....            
   }
});

在DIV区域上使用AJAX加载数据时不工作就像

<a href="javascript:;;" class="edit">EDIT</a>
相关文章：