Question

我有一个包含以下所示值的选择框：

<div>
<select class="skilltest">
     <option>Enter</option>
     <option class="add">Add</option>
</select>
</div>
<div class="disableskill">
<input type="text" class="form-control" name="Advanced" id="exampleInputName" placeholder="tell me your Skill level">
</div>


//next same div as above


<div>
<select class="skilltest">
     <option>Enter</option>
     <option class="add">Add</option>
</select>
</div>
<div class="disableskill">
<input type="text" class="form-control" name="Advanced" id="exampleInputName" placeholder="tell me your Skill level">
</div>

我有多个div使用类padnone。当我单击特定div类padnone的高级值时，它应该在该特定主div的名为disableskill的div类中显示输入文本框。

我为它编写了一个jquery，但它显示了每个div的所有输入文本框。

$("select.skilltest").change(function()
{

    alert("Checkbox is checked.");
    var skillvalue=$(this).val();
    alert(skillvalue);
    if(skillvalue  == "add")
    {
        alert("Checkbox is checked.");
        $(this).find("div.disableskill").show();


    }
    else{

        $(this).find("div.disableskill").hide();

    }
});

有人可以说这个解决方案吗？

Answer 1

如果我理解你，试试这个：

$("div.disableskill").hide();

$("select.skilltest").change(function()
{
    var closestSelect = $(this).parent();  
    var skillvalue = $(this).val();
    
    if(skillvalue  == "Add")
    {
      $(closestSelect).next().show();
    }
    else{
           $(closestSelect).next().hide();
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
 <select class="skilltest">
     <option>Enter</option>
     <option class="add">Add</option>
 </select>
</div>
<div class="disableskill">
 <input type="text" class="form-control"  name="Advanced" id="exampleInputName"  placeholder="tell me your Skill level">
</div>



//next same div as above


<div>
<select class="skilltest">
     <option>Enter</option>
     <option class="add">Add</option>
</select>
</div>
<div class="disableskill">
<input type="text" class="form-control" name="Advanced" id="exampleInputName" placeholder="tell me your Skill level">
</div>

从选择框中选择值时，如何显示特定div的输入文本框？

1 个答案: