Question

我的form第一个字段为dropdown，其中包含student和employee等选项。以下是college name和company name的两个文本字段。

如果某人选择student，则college name文本框应为enabled，并且应禁用company name文本框，如果有人点击employee则company field应为enabled，college field应为disabled。

并且cursor焦点应automatically根据用户选择的下拉列表移至particular field。（学生选择company的示例应为disabled并且cursor焦点应该指向college字段。反之亦然）我该怎么做？

    <div class="container">
      <div class="row main">
    <div class="panel-heading">
             <div class="panel-title text-center">
                <h1 class="title">Company Name</h1>
                <hr />
              </div>
          </div> 
    <div class="main-login main-center">
      <form class="form-horizontal" method="post" action="#">

        <div class="form-group">
          <label for="name" class="cols-sm-2 control-label">I am a</label>
          <div class="cols-sm-10">
            <div class="input-group">
              <span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
                <select name="cars">
                  <option value="volvo">Student</option>
                  <option value="saab">Employee</option>

                </select>
            </div>
          </div>
        </div>

        <div class="form-group">
          <label for="email" class="cols-sm-2 control-label">College Name</label>
          <div class="cols-sm-10">
            <div class="input-group">
              <span class="input-group-addon"><i class="fa fa-envelope fa" aria-hidden="true"></i></span>
              <input type="text" class="form-control" name="email" id="email"  placeholder="Enter your Email"/>
            </div>
          </div>
        </div>

        <div class="form-group">
          <label for="username" class="cols-sm-2 control-label">Company Name</label>
          <div class="cols-sm-10">
            <div class="input-group">
              <span class="input-group-addon"><i class="fa fa-users fa" aria-hidden="true"></i></span>
              <input type="text" class="form-control" name="username" id="username"  placeholder="Enter your Username"/>
            </div>
          </div>
        </div>

        <div class="form-group ">
          <button type="button" class="btn btn-primary btn-lg btn-block login-button">Register</button>
        </div>
        <div class="login-register">
                <a href="index.php">Login</a>
             </div>
      </form>
    </div>
      </div>
    </div>


  </body>

Answer 1

使用$（selector）.focus（）函数和相应的if else条件来解决问题。希望能帮助到你。这里可以使用适当的类或id来选择选择器。

如何通过窗体上的jquery将光标移动到特定字段？

1 个答案: