0

自昨晚以来,我一直在尝试解决此问题,但仍然没有运气。在这方面我非常需要帮助。情况如下:我有 4 张可点击的图片,每张图片在我的 html 文件中都有一个 clickCount 文本框。clickCount 文本框将显示图像被点击的次数。我让前 2 个图像正常工作,但是当我单击第 3 个图像时,第 2 个图像上的 clickCount 文本框会增加。这是我的代码:

    <script> 
  var targetId="";

 $(".foods").click(function(event) {
  if (event.target.id=="img1"){
  targetId="img1clickCount";
    addOrders();}

else if(event.target.id="img2"){
  targetId="img2clickCount";
    addOrders();    }

else if(event.target.id="img3"){
  targetId="img3clickCount";
    addOrders();    }

else if(event.target.id="img4"){
  targetId="img4clickCount";
    addOrders();    }

}); });

function addOrders(){
document.getElementById(targetId).value=parseInt(document.getElementById(targetId).
    value)+1;
}
  </script>

<body>
<table cellpadding=0 cellspacing=0 border=1 height=330 style="margin-left:18px">
<tr>

 //Images
<td><img src="gangjeong.png" width="100" style="cursor:pointer" id="img1"                              
class="foods"></td>
<td><img src="daktoritang.png" width="100" style="cursor:pointer" id="img2"
class="foods"></td>
<td><img src="tangsuyuk.png" width="100" style="cursor:pointer" id="img3"      
class="foods"></td>
<td><img src="tangsuyuk.png" width="100" style="cursor:pointer" id="img4"      
class="foods"></td>
<tr height="5">

//Textboxes
<td><input type="text" maxlength="5" readonly="readonly" value="0" id="img1clickCount">
</td>
<td><input type="text" maxlength="5" readonly="readonly" value="0" id="img2clickCount">
</td>
<td><input type="text" maxlength="5" readonly="readonly" value="0" id="img3clickCount">
</td>
<td><input type="text" maxlength="5" readonly="readonly" value="0" id="img4clickCount">
</td>
</tr></table>
4

6 回答 6

3

第一个条件;

if (event.target.id=="img1"){      // Compares

第二个条件;

if (event.target.id="img2"){       // Uses = (ie assigns, not compares)
于 2013-08-16T04:21:59.427 回答
1

在您的其他条件下检查==

做了

$(".foods").click(function(event) {
  if (event.target.id=="img1") {
    targetId="img1clickCount";
    addOrders();
  }
  else if(event.target.id=="img2") {
    targetId="img2clickCount";
    addOrders();
  }
  else if(event.target.id=="img3"){
    targetId="img3clickCount";
    addOrders();
  }
  else if(event.target.id=="img4"){
    targetId="img4clickCount";
    addOrders();
  }
})
于 2013-08-16T04:23:22.950 回答
1

你应该使用===你的比较

else if(event.target.id === "img2"){
于 2013-08-16T04:24:36.817 回答
0

您需要使用==而不是=进行比较,前者是比较运算符,而后者是赋值运算符

于 2013-08-16T04:22:27.573 回答
0

像这样重写你的代码,它更简单 -

$(".foods").click(function(event) {
    addOrders($(this).attr('id') + 'clickCount');
});

function addOrders(targetId){
    var value = parseInt(
        $('#' + targetId).val()) + 1;
    $('#' + targetId).val(value);
}
于 2013-08-16T04:26:16.070 回答
0

其他所有人都已经指出了您的 =/== 错字。

但不要使用所有 if/then/elseif,而是使用 DRY 方法:

targetId = this.id + clickCount;
addOrders();

event.target请注意,使用 jQuery 时不需要使用,它会绑定this到所有事件处理程序中的目标元素。

我还建议不要设置全局变量,而是将其targetId作为参数传递给addOrders.

于 2013-08-16T04:26:16.383 回答