表單字段數量上/下按鈕，不允許負數？

http://jsfiddle.net/KYDPd 表單字段數量上/下按鈕，不允許負數？

有沒有辦法讓最小數爲0，並且不允許用戶點擊時低於0？

<form> 
    <input type="text" name="name" value="0" /> 
    <input type="button" value="up" onclick="this.form.name.value++;" > 
    <input type="button" value="down" onclick="this.form.name.value--;"> 
</form>

來源

2012-04-12 deflime

你應該把這個JavaScript放在function。

<form> 
    <input type="text" name="name" value="0" /> 
    <input type="button" value="up" onclick="this.form.name.value++;" > 
    <input type="button" value="down" onclick="if(this.form.name.value>0)this.form.name.value--;"> 
</form>

附加應答與功能。

<script> 

function ud_find_text(self) { 
    var children = self.parentNode.getElementsByTagName('input'); 
    for (var i = 0; i < children.length; i++) { 
     if (children[i].getAttribute('type') == 'text') { 
      return children[i]; 
     } 
    } 
} 

function ud_inc(self) { 
    var text = ud_find_text(self); 
    text.value++; 
} 

function ud_dec(self) { 
    var text = ud_find_text(self); 
    if (text.value > 0) text.value--; 
} 

</script> 

<form> 
    <input type="text" name="name" value="0" /> 
    <input type="button" value="up" onclick="ud_inc(this)" > 
    <input type="button" value="down" onclick="ud_dec(this)"> 
</form>

來源

2012-04-12 08:53:04 diolemo

這可能是最好的一個，因爲我需要這個重複約200次在表格內。重複這個功能我認爲會在標記上過度。 – deflime 2012-04-12 09:00:47

@deflime我已經添加到答案，顯示如何使用函數來完成它。您可以定義一次函數，然後爲每個字段重複使用它們。請注意，它假定要更改的字段始終是文本字段！ – diolemo 2012-04-12 09:18:19

@deflime另外：使用jQuery可以使代碼縮短很多。 – diolemo 2012-04-12 09:18:38

這應該有所斬斷。在允許每個操作之前檢查值是多少。還在文本輸入中添加了onchange以實現您的最低0要求。同意這個應該在一個函數中的其他答案。

http://jsfiddle.net/xqV6V/1/

<form> 
    <input type="text" name="name" value="0" onchange="if(this.value<0){this.value=0;}" /> 
    <input type="button" value="up" onclick="if(this.form.name.value>=0){this.form.name.value++;}" > 
    <input type="button" value="down" onclick="if(this.form.name.value>0){this.form.name.value--};"> 
</form>

來源

2012-04-12 08:54:28 Treborbob

我可以接受兩個答案:)？交換添加非常棒。不是真的擔心人們手動輸入一個負數，但還是一個很好的補充。 – deflime 2012-04-12 09:10:31

如果單獨的按鈕是沒有必要的，HTML5是你可以只使用一個選項：

<form> 
    <input type="number" min="0" name="name" value="0" /> 
</form>

來源

2012-04-12 09:11:49 onik

表單字段數量上/下按鈕，不允許負數？

回答

相關問題