下拉菜单不能与jquery一起工作 - dropdown menu not working with jquery

dropdown menu not working with jquery

在我的项目中，我有菜单和较小的屏幕，我使用下拉菜单。下面是相应的HTML代码

<select> 
  <option value="index.php" id="home">Home</option>
  <option value="about?aboutus=aboutus" id="about">About Us</option>
  <option value="courses?cosoff=cosoff" id="courses">Courses Offered</option> 
  <option value="admission?admi=admi" id="admission">Admission</option> 
  <option value="facelities?face=face" id="facelities">Facelities</option>
  <option value="events?eve=eve" id="events">Events</option> 
  <option value="career.php?car=car" id="career">Career</option> 
  <option value="contact.php?con=con" id="contact">Contact</option> 
  </select>

和我使用jquery来选择菜单并保持选中状态。它是

<script type="text/javascript">
   window.onload = function() {
      $(document).ready(function() {
         $("#about").children("option").is("selected").text()
      });
   }
</script>

这只是为id=about，就像我把jquery的每个id，但它不工作的选项值设置选定。第二个问题是id=home是默认选中的然后我输入for ex。id=about然后再输入id=home它不会重定向到index。php

您可以使用 prop() 函数设置选择的选项。

$(document).ready(function() {
    $("#about").prop('selected',true)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<select> 
  <option value="index.php" id="home">Home</option>
  <option value="about?aboutus=aboutus" id="about">About Us</option>
  <option value="courses?cosoff=cosoff" id="courses">Courses Offered</option> 
  <option value="admission?admi=admi" id="admission">Admission</option> 
  <option value="facelities?face=face" id="facelities">Facelities</option>
  <option value="events?eve=eve" id="events">Events</option> 
  <option value="career.php?car=car" id="career">Career</option> 
  <option value="contact.php?con=con" id="contact">Contact</option> 
</select>

<标题>编辑1

为所有选项提供id可能不是很容易，所以您可以使用select选项的索引来做同样的事情。

$(document).ready(function() {
    $("select option").eq(1).prop('selected', true);//selects the second option.
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<select> 
  <option value="index.php">Home</option>
  <option value="about?aboutus=aboutus">About Us</option>
  <option value="courses?cosoff=cosoff">Courses Offered</option> 
  <option value="admission?admi=admi">Admission</option> 
  <option value="facelities?face=face">Facelities</option>
  <option value="events?eve=eve">Events</option> 
  <option value="career.php?car=car">Career</option> 
  <option value="contact.php?con=con">Contact</option> 
</select>

您必须使用prop()函数。

$(document).ready(function() {
$("#yourid").prop('selected',true);
});