當我選擇“數字”選項時，它不顯示<input id="number">。我希望在不輸入的情況下選擇所有數字，但是當單擊“數字”選項時，它顯示<input id="number">。用戶可以在 中輸入一個數字<input id="number">。var select = document.getElementById("select");$("#select").change(function() { var res = select.options[select.selectedIndex].getAttribute("name"); document.getElementById('number').value = select.options[select.selectedIndex].getAttribute("name"); $('#number').hide(); $('#help').hide(); $('#' + $(this).val()).show(); return false;});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script><form action="index.php" method="post"> <select name="select" id="select"> <option value="1" name="1">1</option> <option value="2" name="2">2</option> <option value="3" name="3">3</option> <option value="number" name="">Number</option> <option value="help" name="">Help</option> </select> <input id="number" type="hidden" name="number" value="Choose" style="display:none" /> <label id="help" style="display:none">Help!</label> <input type="submit" value="submit" /></form>
2 回答
萬千封印
TA貢獻1891條經驗 獲得超3個贊
如果您輸入type="number"而不是type="hidden"，它將強制用戶僅輸入數字。
var select= document.getElementById("select");
$("#select").change(function(){
var res=select.options[select.selectedIndex].getAttribute("name");
document.getElementById('number').value=select.options[select.selectedIndex].getAttribute("name");
$('#number').hide();
$('#help').hide();
$('#' + $(this).val()).show();
return false;
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<form action="index.php" method="post">
<select name="select" id="select">
<option value="1" name="1">1</option>
<option value="2" name="2">2</option>
<option value="3" name="3">3</option>
<option value="number" name="">Number</option>
<option value="help" name="">Help</option>
</select>
<input id="number" type="number" name="number" value="Choose" style="display:none"/>
<label id="help" style="display:none">Help!</label>
<input type="submit" value="submit"/>
</form>
精慕HU
TA貢獻1845條經驗 獲得超8個贊
不要使用type="hidden"。因為它在 html 上不可見，如果display:block也。并且您已經在使用 jquery，所以最好將選擇器與 jquery 一起使用$(this).find('option:selected').attr('name')
var select = document.getElementById("select");
$("#select").change(function() {
var res = $(this).find('option:selected').attr('name')
$('#number').val(res)
$('#number').hide();
$('#help').hide();
$('#' + $(this).val()).show();
return false;
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form action="index.php" method="post">
<select name="select" id="select">
<option value="1" name="1">1</option>
<option value="2" name="2">2</option>
<option value="3" name="3">3</option>
<option value="number" name="">Number</option>
<option value="help" name="">Help</option>
</select>
<input id="number" name="number" value="Choose" style="display:none" />
<label id="help" style="display:none">Help!</label>
<input type="submit" value="submit" />
</form>
- 2 回答
- 0 關注
- 120 瀏覽
添加回答
舉報
0/150
提交
取消