功能在选择特定下拉值时执行

时间:2019-03-21 08:02:56

标签: javascript php jquery

我陷入了一个奇怪的问题。我有下拉列表通过数据库填充值。填充后,我追加新值。不,当用户选择此新值时,我想调用函数。

if($('#ab option:selected').text() === "Other")
{
	$('#txtbox').show();
}
<select class="form-control col-md-7 col-xs-12" id="ab" >
      <option select = "selected" value = "" >Select county </option>
	 
      <?php
       $con=mysqli_connect("localhost","root","","db1");

//Check connection
if (mysqli_connect_errno()) {
  echo "Failed to connect to MySQL: " . mysqli_connect_error();
}  
      $sql = "select county from tbl WHERE Code = 'a'";
      $res = mysqli_query($con, $sql);
      if(mysqli_num_rows($res) > 0) {
        while($row = mysqli_fetch_object($res)) {
          echo "<option value='".$row->id."'>".$row->county."</option>";
		  
        }
		echo "<option value='".$row->id."'>Other";
      }
      ?>

    </select>

我尝试了很多事情,但是没有用

1 个答案:

答案 0 :(得分:2)

使用change event handler并在回调中移动代码。

$('#ab').change(function(){
    if($(this).text() === "Other"){
        $('#txtbox').show();
    } else{ // add else part to hide the element
        $('#txtbox').hide();
    }
});

仅供参考:您可以使用toggle()方法来简化代码。

$('#ab').change(function(){
    $('#txtbox').toggle($(this).text() === "Other");
});

您在服务器端代码中缺少最后一个option的结束标记。

echo "<option value='".$row->id."'>Other</option>";
// -- here -----------------------------^^^^^^^^^^----

仅供参考:在document ready handler中加载所有元素包装代码后,可正确运行jQuery代码。