Question

我正在尝试使用jquery进行数量增加和减少，它正常工作但如果一次值为1那么我怎么能避免减量操作。我尝试使用if else s =条件，但它没有整理出来请教我...

jQuery('#inc').click(function() {
     jQuery('.output').html(function(i, val) { return val*1+1 });
 });
jQuery('#dec').click(function() {
    jQuery('.output').html(function(i, val) { return val*1-1 });
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<div class="row">
    <div class="col-sm-1" id="dech">
        <p id="dec">-</p>
    </div>
    <div class="col-sm-10">
        <center><b><span class='output' value='1'>1</span> Adult</b></center>
    </div>
    <div class="col-sm-1" id="inch">
        <p id="inc">+</p>
    </div>
</div>

Answer 1

像这样更改增量/减量功能。您在span上使用了value属性，但没有递增/递减其值。虽然它不是必要的，但我觉得它也应该更新。

$('#inc').click(function() {
    $('.output').html(function(i, val) { return val*1+1 });
    $('.output').attr("value",$('.output').html().trim())
});
$('#dec').click(function() {
   if ($(".output").text().trim() === "1") return;
    $('.output').html(function(i, val) { return val*1-1 });
    $('.output').attr("value",$('.output').html().trim())
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="row">
                    <div class="col-sm-1" id="dech">
                        <p id="dec">-</p>
                    </div>
                    <div class="col-sm-10">
                        <center><b><span class='output' value='1'>1</span> Adult</b></center> 
                    </div>
                    <div class="col-sm-1" id="inch">
                        <p id="inc">+</p>
                    </div>
                </div>
<script>
$('#inc').click(function() {
    $('.output').html(function(i, val) { return val*1+1 });
    $('.output').attr("value",$('.output').html().trim())
});
$('#dec').click(function() {
   if ($(".output").text().trim() === "1") return;
    $('.output').html(function(i, val) { return val*1-1 });
    $('.output').attr("value",$('.output').html().trim())
}); 
</script>

Answer 2

在你的dec函数中，确保该值大于1.此处的工作代码：

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
   $('#inc').click(function() {
      $('.output').html(function(i, val) { 
      	return val*1+1 
      });
   });
   $('#dec').click(function() {
        $('.output').html(function(i, val) {
        	if(val>1)
        	return val*1-1 
        });
   }); 
});
</script>
</head>
<body>

<div class="row">
   <div class="col-sm-1" id="dech">
      <p id="dec">-</p>
   </div>
   <div class="col-sm-10">
      <center><b><span class='output' value='1'>1</span> Adult</b></center> 
   </div>
   <div class="col-sm-1" id="inch">
      <p id="inc">+</p>
   </div>
</div>

</body>
</html>

Answer 3

你真的不需要乘法，但只需添加一个if语句。

$('#dec').click(function() {
    $('.output').html(function(i, val) { 
       if(val > 1)
         return val - 1;
    });
});

作为一个三元：

$('#dec').click(function() {
    $('.output').html(function(i, val) { 
         return (val > 1) ? val - 1 : val; 
    });
});

Answer 4

这就是你要找的东西：D欢呼

jQuery('#inc').click(function() {
     jQuery('.output').html(function(i, val) { return val*1+1 });
 });
jQuery('#dec').click(function() {
    jQuery('.output').html(function(i, val) { let _val; _val = val*1-1 ? val*1-1 : 1; return _val });
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<div class="row">
    <div class="col-sm-1" id="dech">
        <p id="dec">-</p>
    </div>
    <div class="col-sm-10">
        <center><b><span class='output' value='1'>1</span> Adult</b></center>
    </div>
    <div class="col-sm-1" id="inch">
        <p id="inc">+</p>
    </div>
</div>

Answer 5

在减少时，只需检查该值是否已经为1（或以下，以防万一）。在这种情况下，只返回1，否则请减少值。请注意，乘法* 1用于在解决方案中解析String to Number。

＆＃13;

jQuery('#inc').click(function() {
     jQuery('.output').html(function(i, val) { return val * 1 + 1 });
 });
jQuery('#dec').click(function() {
    jQuery('.output').html(function(i, val) { return val*1 <= 1 ? 1 : val * 1 - 1 });
  });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<div class="row">
    <div class="col-sm-1" id="dech">
        <p id="dec">-</p>
    </div>
    <div class="col-sm-10">
        <center><b><span class='output' value='1'>1</span> Adult</b></center>
    </div>
    <div class="col-sm-1" id="inch">
        <p id="inc">+</p>
    </div>
</div>

＆＃13;

Answer 6

你可以使用这样的三元运算符：

foo.call = (lambda _: "bye").__get__(foo, Foo)

如何使用jquery设置值的增量和减量限制

6 个答案: