4

我有一个网站，用户可以在其中选择一个项目，然后显示详细信息，包括数量。我还在 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);
});

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

4

6 回答 6

10

由于按钮是动态添加的，可以试试：

$(document).on('click', '#btnRemove1', function() {
{
   alert("remove"); //I dont know what remove was is the example, added quotes around it.
});
于 2013-03-27T17:41:58.697 回答
2

那是因为按钮是稍后添加的（动态）。您将不得不使用委托。

你不必为此使用身体。任何作为#btnRemove1 父级的非动态插入元素都可以。

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

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

于 2013-03-27T17:45:57.503 回答
1

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

现在它是：

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

或者你可以在 #btnRemove1 添加到 Dom 之后重新绑定事件。

于 2013-03-27T17:45:17.247 回答
1

最有可能的是，在您尝试将点击事件附加到它之前，您的 Remove 按钮不在 DOM 中。从您的代码片段中很难看出，但如果“购买”按钮操作未成功完成，则“删除”将不存在。

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

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

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

您应该使用 .on() 而不是已弃用的 .click()。

于 2013-03-27T17:49:40.490 回答
0

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

///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
于 2013-03-27T17:44:05.777 回答
0 
$('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>
于 2013-04-23T19:18:21.037 回答