使用.val（）计算输入jQuery

Question

我正在处理一个项目，我必须对输入字段的现有值进行一些计算。假设输入值是400或其他。

下方我有一个选择框YES手段添加，NO手段添加或-425。减去;

HTML：

<input id="priceTag" name="priceTag" type="text" value="400"> 

<select id="designChoice" name="designChoice"> 
    <option>Choose--</option> 
    <option value="yes">yes</option> 
    <option value="no">no</option> 
</select> 

的jQuery：

jQuery(document).ready(function($){ 

    var priceTag = $('#priceTag');   

    $('#designChoice').on('change', function(){ 

     if($(this).val()==='yes'){    
      /* Here i want to add + 425 to the */ 

     }else{ 
      /* Here I want to add nothing to the input or substract -425 */ 
     } 

    }); 
}); 

我已经试过：

priceTag.val(+ 425); 
/* And more of this type of wrong code ;-P */ 

我试图查找现有的例子，但我没有找到很多例子都非常感谢您的回答！

Answer 1

的逻辑，这是一个比较复杂的。您需要知道在no已被点击之前是否已添加425，在这种情况下，您需要减去425，而不是仅添加0。

考虑到这一点，你可以一个data属性添加到输入包含它的起拍价：

<input id="priceTag" name="priceTag" type="text" value="400" data-default="400"> 

然后当select改变，你可以将数据属性转换为整数，然后进行计算在上面。试试这个：

jQuery(document).ready(function ($) { 
    var $priceTag = $('#priceTag');   
    $('#designChoice').on('change', function() { 
     if ($(this).val() === 'yes') { 
      $priceTag.val(parseInt($priceTag.data('default'), 10) + 425);    
     } else { 
      $priceTag.val($priceTag.data('default')); 
     }   
    }); 
}); 

Example fiddle

Answer 2

使用此：

JS：

jQuery(document).ready(function($){ 

    var priceTag = $('#priceTag');   
    var selectedYes=false; 
    $('#designChoice').on('change', function(){ 
     if($(this).val()==='yes'){    
      /* Here i want to add + 425 to the */ 
      selectedYes=true; 
      priceTag.val((+priceTag.val()) + 425); 
     }else if (selectedYes){ 
      /* Here I want to add nothing to the input */ 
      priceTag.val((+priceTag.val()) - 425); 
      selectedYes=false; 
     } 

    }); 
}); 

的jsfiddle：http://jsfiddle.net/ghorg12110/0xvkupe2/1/

Answer 3

保存的#priceTag网页加载数据的属性和值，每当用户改变它：

jQuery(document).ready(function($){ 
 

 
    var priceTag = $('#priceTag'), 
 
     designChoice = $('#designChoice'); 
 
    
 
    //save initial value and whenever it is changed to a data attribute 
 
    priceTag.on('change', function() { 
 
     $(this).data('value', this.value); 
 
     designChoice.change(); 
 
    }) 
 
    .change(); 
 

 
    designChoice.on('change', function(){ 
 

 
     if($(this).val()==='yes') { 
 
      /* Here i want to add + 425 to the */ 
 
      priceTag.val(+priceTag.data('value') + 425); 
 
     } else{ 
 
      /* Here I want to add nothing to the input or substract -425 */ 
 
      priceTag.val(priceTag.data('value')); 
 
     } 
 

 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<input id="priceTag" name="priceTag" type="text" value="400"> 
 

 
<select id="designChoice" name="designChoice"> 
 
    <option>Choose--</option> 
 
    <option value="yes">yes</option> 
 
    <option value="no">no</option> 
 
</select>

Answer 4

这。

的jQuery：

var priceTagAns = 0; 
$(document).ready(function(){ 

    $('#designChoice').on('change', function(){ 

     if($(this).val()==='yes'){    
      /* Here i want to add + 425 to the */ 
      priceTagAns = (Number($("#priceTag").val()) + 425); 
     }else{ 
      /* Here I want to add nothing to the input */ 
      priceTagAns = (Number($("#priceTag").val())); 
     } 
     alert(priceTagAns); 
    }); 

}); 

警报仅仅是为了证明该值设置，用它做你想要什么。

工作的jsfiddle：http://jsfiddle.net/89z7qpkf/2/

*更新*

也是可变的版本：http://jsfiddle.net/89z7qpkf/3/