-1

我已经搜索了所有内容，但找不到一个好的解决方案，或者是否可以通过客户端验证。

我的客户要求根据下拉列表中的选择将用户限制为固定长度的数字组合。

示例：
下拉选择
实用程序 A
实用程序 B
实用程序 C

文本输入
如果用户选择实用程序 A，他们必须提供一个 8 位数的帐号。
如果用户选择实用程序 B，他们必须提供 10 位数的帐号。
如果用户选择实用程序 C，他们必须提供 12 位数的帐号。

任何人都知道一个简单的javascript解决方案可以提供答案吗？为此我已经把自己打死了。

谢谢！

4

2 回答 2

0

干得好！

HTML

<select id="Select" onchange="checkText()">
  <option value="8"> A</option>
  <option value="10"> B</option>
  <option value="12"> C</option>
</select>

<input id="Enter" type="text" onchange="checkText()" />

<div id="Message"></div>

JavaScript

function checkText(input) {
  if(document.getElementById("Enter").value.length != document.getElementById("Select").selectedOptions[0].value) {
    document.getElementById("Message").innerHTML = "Your ID has to be " + document.getElementById("Select").selectedOptions[0].value + " digits long";
  } else {
    document.getElementById("Message").innerHTML = "";
  }
}

这一点都不精彩。但我不会为你做你的工作。您可以从这里轻松取货。

我还创建了一个jsFiddle

于 2013-01-17T15:37:31.213 回答
0

select您的下拉菜单在哪里，input您的输入字符串在哪里，您可以使用：

if ( !/^\d+$/.test(input) ||
    input.length != [ 8, 10, 12 ][ select.selectedIndex ] ) {
    // Input invalid
}

除了@Amberland 的反馈：

或者，对于更通用的解决方案，将所需位数存储为每个选项元素的值，例如<option value=8>Utility A</option>，并使用：

if ( !/^\d+$/.test(input) || input.length != select.value ) {
    // Input invalid
}
于 2013-01-17T15:43:28.883 回答