Question

我有一个下拉列表

<div class="col-lg-8">
   <select class="form-control" id="question_type" name="agreement[question_type]">
      <option value="">Select Type</option>
      <option value="ss">Single select (checkbox)</option>
      <option value="ms">Multi option (radio)</option>
   </select>
</div>

提交表格后，我已将此数据放在表格中，

<tr data-view-key="<?php echo $jagr_id; ?>">
   <td class="question_type">
   <?php
   if ($jagr_question_type == 'ss') {
       echo 'Single select (checkbox)';
   } else if ($jagr_question_type == 'ms') {
       echo 'Multi option (radio)';
   }
   ?>
    </td>
    <td><a href="#<?php echo $jagr_id; ?>" name="edit_agreement" ><span class="glyphicon glyphicon-edit" title="Edit"></span></a>&nbsp;&nbsp; <a href="#<?php echo $jagr_id; ?>" name="delete_agreement" ><span class="glyphicon glyphicon-trash" title="Delete"></span></a></td>
</tr>

并在编辑按钮上单击，我想在下拉列表中显示所选项目。以下代码用于编辑单击

$(document).on("click", "a[name = 'edit_agreement']", function(event)
{
   event.preventDefault();
   var jagr_id = $(this).attr("href").substring(1);
   var parent = $(this).parents("[data-view-key='"+jagr_id+"']");
   var question_type = parent.find("td.question_type").text();
   $("#hdn_jagr_id").val(jagr_id);
   $("#question_type option:selected").text(question_type);     
});

使用$("#question_type option:selected").text(question_type);我可以在下拉列表中显示文本，但是再次提交未发布的值的表单，现在html部分改变了这样（重复选择的项目）

<div class="col-lg-8">
   <select class="form-control" id="question_type" name="agreement[question_type]">
      <option value>Single select (checkbox)//selected item</option>
      <option value="ss">Single select (checkbox)</option>
      <option value="ms">Multi option (radio)</option>
   </select>
</div>

Answer 1

我真的不知道question_type应该是什么..是一个选项的文本或选项的价值..你需要的所有方式

.prop('selected' , true);

如果question_type是选项

的值

$("#question_type option[value='"+question_type+"']").prop('selected' , true);

如果question_type是选项文本，则可以使用.filter（）;

$("#question_type option").filter(function(){
   return $(this).text().trim() == question_type;
}).prop('selected' , true);

<强> Working Demo

Answer 2

此选项对我有用：

$(document).ready(function(){

   $("#countryList").change(function(){

       var selectedCountry = $(this).children("option:selected").val();

       console.log("You have selected the country - " + selectedCountry);

   });

});

当然，您需要具有国家/地区的HTML列表。像这样：

<select id="countryList">
    <option value="1">USA</option>
    <option value="2">Brasil</option>
    <option value="3">Spain</option>
</select>

如何使用jquery在下拉列表中显示所选值

2 个答案: