0

我希望能够在选择某个值时显示适当的文本框。我将不胜感激任何帮助。 

JQUERY 
$('#enterdatabox').change(function() {
var selected = $(this).val();
  $('#' + selected).css('display', selected ? 'block' : 'none');
});



HTML
<select name="enterdatabox" id="enterdatabox">
      <option value="">Please Choose...</option>
      <option value="option1">Option 1</option>
      <option value="option2">Option 2</option>
      <option value="option3">Option 3</option>
      <option value="option4">Option 4</option>
      <option value="option5">Option 5</option>
      <option value="option6">Option 6</option>
      <option value="option7">Option 7</option>
      <option value="option8">Option 8</option>
</select>

<input type="text" id="option1" style="display: none;" />
<input type="text" id="option2" style="display: none;" />
<input type="text" id="option3" style="display: none;" />
<input type="text" id="option4" style="display: none;" />
<input type="text" id="option5" style="display: none;" />
<input type="text" id="option6" style="display: none;" />
<input type="text" id="option7" style="display: none;" />
<input type="text" id="option8" style="display: none;" />
4

1 回答 1

-1

您的代码很好，但问题可能是您在元素存在.change之前绑定。#enterdatabox有三个简单的解决方案：

  1. 将 JavaScript 代码移到 HTML之后
  2. 将 JavaScript 代码包装在$(document).ready(function () {}
  3. 使用事件委托，例如$(document).on('change, '#enterdatabox', function () {

第一个可能是最简单的。

顺便说一句，您可以通过删除所有 id 并将其包装<input>在 div 中并使用比较来使此代码更简单.index()

于 2013-04-07T16:34:41.870 回答