我想设置文本框的最大长度,这取决于用户对上一个文本框的回答

I want to set maxLength of a textbox which depends on the users answer to a previous textbox

本文关键字:用户 取决于 上一个 文本 置文本      更新时间:2023-09-26

所以基本上HTML表单会询问他们属于哪家公司,以及他们是否选择例如:-

<select name="catg" onchange='maxlength()'>
<option> Select..</option>
        <option value="stu">Uni Student</option>
        <option value="anothersstu">Student at another institution</option>
        <option value="staff">Uni Staff</option>
        <option value="other">other</option>
    </select><br />
    Student Number / Staff Number: <input type="text" name="ss"/> <br />
    function maxlength(){
    if(test.catg.selected=="stu"){
    test.ss.maxlength='8';
    .focus();
    .select();}
    return;
    }
如果用户选择 Uni 学生或 Uni 教职员工

,则"学生编号/教职员工编号"文本框的最大长度需要为 8。

我怎样才能做到这一点? 我已经尝试过更改,但无法使其工作。

你可以做这样的事情:

.HTML:

<select id="select">
<option>Select..</option>
<option value="stu">Uni Student</option>
<option value="anothersstu">Student at another institution</option>
<option value="staff">Uni Staff</option>
<option value="other">other</option>
</select>
<br />Student Number / Staff Number:
<input type="text" id="txt" name="ss" />
<br />

.JS:

 document.getElementById('select').onchange = (function(){
    if(this.value=="stu"){
     document.getElementById('txt').maxLength=8;
    }else{
     document.getElementById('txt').removeAttribute('maxLength');
    }
});

因此,根据您的要求,if else if条件

演示:http://jsfiddle.net/AmitJoki/8ZewM/2

<select name="catg" onchange='maxlength()'>
<option> Select..</option>
        <option value="stu">Uni Student</option>
        <option value="anothersstu">Student at another institution</option>
        <option value="staff">Uni Staff</option>
        <option value="other">other</option>
    </select><br />
    Student Number / Staff Number: <input type="text" name="ss" id="ss"/> <br />

Jquery:

$('select').change(function () {
        var value = this.value;
     if(value=='stu')
     {
          $("#ss").attr('maxlength','8');
     }
     else
     {
          $("#ss").attr('maxlength',''); // clear maxlength if not stu
     }
    });
<select id="selopt" onchange="maxlength()">
<option value="stu">Uni Student</option>
<option value="anothersstu">Student at another institution</option>
<option value="staff">Uni Staff</option>
<option value="other">other</option>
</select>
Student Number / Staff Number: <input type="text" id="ss" maxlength=""/> <br />
function maxlength(){
var x = document.getElementById("selopt").selectedIndex;
if(document.getElementById("selopt")[x].value=="stu"){
document.getElementById("ss").maxLength=8;
}
return;
}
<select name="catg" id="catg" onchange="maxLengthFunction()">
        <option> Select..</option>
        <option value="stu">Uni Student</option>
        <option value="anothersstu">Student at another institution</option>
        <option value="staff">Uni Staff</option>
        <option value="other">other</option>
 </select><br />
Student Number / Staff Number: <input type="text" name="ss" id="ss" /> 

在Javascript中

function maxLengthFunction()
{
   var ddl = document.getElementById("catg");
   var strOption = ddl.options[ddl.selectedIndex].text
   if(strOption == "Uni Student" || strOption == "Uni Staff" )
       document.getElementById("ss").maxLength="8";
   else 
      document.getElementById("ss").removeAttribute('maxLength');
}

试试这个

   $(document).ready(function(){
    $("#sele").change(function(){
    var optext=$("#sele option:selected").text();
    if(optext=='Uni Student'||optext=='Uni Staff'){
     $("#tname").val("");
     $("#tname").attr('maxlength','8');
   }
   else{
       $("#tname").val("");
      $("#tname").attr('maxlength','');
   }
  });
 });


  <select  name="sele" id="sele" > <option> Select..</option>
  <option value="stu">Uni Student</option>
   <option value="anothersstu">Student at another institution</option>
  <option value="staff">Uni Staff</option>
  <option value="other">other</option>
 </select><br />
  Student Number / Staff Number: <input type="text" name="ss" id="tname"/>