如果任何输入字段不为空或不等于0 javascript

时间:2017-11-20 13:30:50

标签: javascript jquery html css

我有股票表。我使用sql statemnet从堆栈表中提取数据,使用while循环显示在网页上。

请看图片。 stock page

每行股票旁边都有一个空输入字段。用户应该通过在空白字段中输入数字来查看库存并更新库存。因此,我希望它的工作方式是用户输入库存,输入库存号,而不是页面底部有按钮,用户必须单击以更新库存。

如何隐藏所有字段的更新按钮= 0.如果用户输入任何字段,则应显示更新按钮,如果用户更改该值,则返回0应再次隐藏。

如果我给输入字段一个类“stock-val”,而不是使用.change函数,它可以工作,问题是如果用户编辑1个库存项目,而不是另一个,而不是另一个,然后返回并将之前标记为0,按钮隐藏了。我是通过选择类来完成的。如果我将它标记为0.change将隐藏它。

如果至少有1个字段大于0,我需要一种显示更新按钮的方法,如果所有字段都为空则隐藏设置为0.

感谢。

我的Html:

    <div class="table-responsive">          
    <table class="table">
        <tbody>
            <?php
            if(mysqli_num_rows($result_miscellaneous) > 0){
            while($row = mysqli_fetch_array($result_miscellaneous,MYSQLI_ASSOC)){
            ?>
            <tr>
              <td><?php echo $row['description_stk']?></td>
              <td><input class="form-control" type="text" value="<?php echo $row['clipbundleinfo_stk']?>"</td>
              <td><input class="form-control clips-assign-val" type="text" value="0"</td>
             </tr>
            <?php
            } 
        }
       ?> 
         </tbody>
     </table>
 </div>

使用Javascript:

    <script>
       $(document).ready(function(){
      $(".clips-assign-val").change(function(){
       var val = $(this).val();

        if(val > 0 ){
        $('#clip-bundles-assign-button1').show();
      }else {
     $('#clip-bundles-assign-button2').show();

    }

   });
  });
  </script>

那么如果所有输入字段都为空,如何隐藏更新按钮,并且仅在至少1个字段不为空且超过0时显示。

1 个答案:

答案 0 :(得分:0)

每次更改都需要检查是否存在非零输入值。此值可以在除~/Library/Developer/CoreSimulator/Devices事件发生的任何其他输入元素之外,因此您应该检查所有这些元素。您可以使用change。这是一个简化的HTML来演示它:

each
$(document).ready(function(){
	$(".clips-assign-val").change(function(){
		var allZero = true;
		$(".clips-assign-val").each(function () {
			var val = +$(this).val(); // convert string to number
			allZero = allZero && val === 0;
			return allZero; // if false, the loop will be aborted
		});
		$('#clip-bundles-assign-button1').toggle(!allZero);
		$('#clip-bundles-assign-button2').toggle(allZero);
   }).change();
});

注意:如果您只想要数字输入,可以考虑输入<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input class="clips-assign-val" value=0><br> <input class="clips-assign-val" value=0><br> <button id="clip-bundles-assign-button1">Not All Zero</button><br> <button id="clip-bundles-assign-button2">All Zero</button>而不是type="number"