Question

当我选择第一个下拉选项时，它不应显示在下拉选择中。

<select id="purchaseorderto" data-placeholder="items Name" name="purchaseorderto" class="form-control chosen-select" required="required">
     <option selected></option>
     <option value="addnewpoto" class="addnewtxt">Add new </option>
     <option value="1"> Abc</option>
     <option value="2"> Pqr </option>
     <option value="3"> xyz</option>
</select>

当我选择添加新内容时，它不应显示在下拉菜单中，但应该在选择它时打开模式。

Answer 1

检查此代码段。这是你要求的吗？

＆＃13;

var prevVal;
$('#purchaseorderto').click(function() {
  prevVal = $(this).val();
}).change(function() {
  if ($(this).val() === 'addnewpoto') {
    $(this).val(prevVal);
    alert('open model code here');
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="purchaseorderto" data-placeholder="items Name" name="purchaseorderto" class="form-control chosen-select" required="required">
     <option value="addnewpoto" class="addnewtxt">Add new </option>
     <option value="1"> Abc</option>
     <option value="2"> Pqr </option>
     <option value="3"> xyz</option>
</select>

＆＃13;

Answer 2

您可以利用 HTML 中的hidden属性。

<select>
<option selected disabled hidden>Add abc</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
<option value="4">Four</option>
<option value="5">Five</option>
</select>

select{
 margin: 40px;
 width: 50%;   
}

<select>
    <option selected disabled hidden>Add abc</option>
    <option value="1">One</option>
    <option value="2">Two</option>
    <option value="3">Three</option>
    <option value="4">Four</option>
    <option value="5">Five</option>
</select>

试试这个例子

Answer 3

我希望这会有所帮助

$('#purchaseorderto').change(function(event) {

if($( "#purchaseorderto option:selected" ).val() == "addnewpoto")
{
$('#purchaseorderto').prop('selectedIndex',0);
  alert("do something");
}
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="purchaseorderto" data-placeholder="items Name" name="purchaseorderto" class="form-control chosen-select" required="required">
     <option selected></option>
     <option value="addnewpoto" class="addnewtxt">Add new </option>
     <option value="1"> Abc</option>
     <option value="2"> Pqr </option>
     <option value="3"> xyz</option>
</select>

在选择下拉列表的第一个选项时，它不应显示在下拉列表中

3 个答案: