Question

基本上，我有两个字段，一个是选择（下拉）列表，另一个是输入文本框，两个都是不同的问题。

我的问题是，如果我在选择列表（第一个问题）中选择只有一个值，那么文本框（第二个问题）必须长度为6个字符或数字。否则，选择列表中选择的其他值在文本框中可以是10个字符。

如何在不使用正则表达式的情况下以Javascript格式编写此内容？

我已经写了这个脚本的部分内容，但我想看看别人怎么写它。我唯一的问题是将其他值的其余部分设为10个字符。

我还想补充一点，第一个问题不一定是选择列表。我这样做是因为html更易于呈现和组织。

这是我的脚本（到目前为止）：

function imposeMaxLength(object, limit) { 
   var num = document.getElementById("Number").value;
    if (num == "3") {
    document.getElementById("Type").value  {
    return (object.value.length <= limit);
    }
  }
}

HTML：

<label for="number">Number:</label>
   <select size="1" id="Number">
   <option disabled>...</option>
   <option value="1">1</option>
   <option value="2">2</option>
   <option value="3">3</option>
   <option value="4">4</option>
   <option value="5">5</option>
   <option value="6">6</option>
   <option value="7">7</option>
   <option value="8">8</option>
 </select>

<br>Type:<input type="text" id="Type" onkeypress="return imposeMaxLength(this,6);"><br>

<input type="button" value="submit"/>

请帮忙。

Answer 1

我认为你需要这个

<script>
   $('#Number').on('change', function () {
      var value=this.value;
      if(value==1)
        {
            $("#Type").attr('maxlength','6');
        }
      else
        {
            $("#Type").attr('maxlength','10');
        }
   });
</script>

Answer 2

只要Select元素发生变化，就会将maxlength设置为所需的值。因此，如果您选择多个值，则maxlength将更改为10，否则，如果仅选择1个项目，则其最大长度为6。

<div>
   <select size="1" id="Number" multiple>
   <option disabled>...</option>
   <option value="1">1</option>
   <option value="2">2</option>
   <option value="3">3</option>
   <option value="4">4</option>
   <option value="5">5</option>
   <option value="6">6</option>
   <option value="7">7</option>
   <option value="8">8</option>
   </select>
</div>
<div>
    <input type="text" id="Type" />
</div>
<div>
<input type="button" value="submit"/>

$("#Number").on('change', function() {
  var selects = $(this).find('option:selected');
  if(selects.length > 1) {
    $("#Type").attr('maxlength', 10);
  } else {
    $("#Type").attr('maxlength', 6);
  }
});

Demo

Answer 3

你可以简单地使用属性maxlength：

<强> HTML

<input type="text" id="Type" maxlength="1"/><!-- default value in select -->

<select onchange="imposeMaxLength(this.value);">

<强> JS

<script>
    function imposeMaxLength(max) {
      document.getElementById("Type").maxlength = max;
    }
</script>

必填字段并选择下拉列表值

3 个答案: