Javascript 但是，根据下拉选择隐藏和显示输入文本

根据下拉选择隐藏和显示输入文本，但当我提交表单且未完成表单验证时，输入文本不再显示

我正在使用jquery，我可以显示和隐藏，工作得很好，但这部分让我很烦恼

我的客户不会填写所有表单字段，因此当他们提交表单时，我希望他们根据下拉选择查看输入文本，而不是缺少输入文本

$(document).ready(function() {
    $('#shipping').change(function() {
        if ( $("#shipping").val ()  ==  "LA") 
        {                              
            $('#mydiv').show();
        }
        else
            $("#mydiv").hide();
    }); 
});

<select name="shipping" id="shipping">
 <option value="LA">LA</option>
 <option value="NYC">NYC</option>
</select>

<tr id="mydiv" style="display:none">
<td><input type="text" name="testing"></td>
</tr>


<tr>
<td><input type="text" name="testing2"></td>
</tr>



<tr>
<td><input type="text" name="testing3"></td>
</tr>

<input type="submit" value="Submit" />

看这里的地图。它起作用了。 我在html中没有看到标记，这是一个问题

<select name="shipping" id="shipping">
    <option value="select">Select</option>
    <option value="LA">LA</option>
    <option value="NYC">NYC</option>
</select>
<table>
<tr id="mydiv" style="display:none">
    <td>
        <input type="text" name="testing" value="show/hide"/>
    </td>
</tr>
<tr>
    <td>
        <input type="text" name="testing2"/>
    </td>
</tr>
<tr>
    <td>
        <input type="text" name="testing3"/>
    </td>
</tr>
    </table>
<input type="submit" value="Submit" />

---

您要验证的内容

if textbox is hidden , it should be part of validation or not 
if that is part of validation use 
$('#id').prop("required", "true");
else
$('#id').removeAttr("required");

---

尝试使用一个类来隐藏它，而不是使用内联样式，例如

<tr id="mydiv" class="hidden">
<td><input type="text" name="testing"></td>
</tr>

或 当您想要显示mydiv时，请尝试删除“隐藏”类

$(document).ready(function() {
    $('#shipping').change(function() {
        if ( $("#shipping").val ()  ==  "LA") 
        {                              
            $('#mydiv').removeClass('hidden');
        }
        else
            $("#mydiv").addClass('hidden');
    }); 
});

---

它会起作用的

如果您希望在页面重新加载该信息时显示div，则需要在页面加载时检查所选信息。 不要使默认显示为“无”。加载页面时将其隐藏

 $(document).ready(function() {
 $("#mydiv").hide();

var shipLocation = $("select#shipping").val();
if ( shipLocation ==  "LA") 
    {                              
        $('#mydiv').show();
    }

---

然后添加您的配送更改方法。

请同时发布您的html。最好在此分享您的html！mydiv的样式为display：默认为none。。删除它&您可以看到它。但我只想在从下拉列表中选择时显示它？我确实移除了它，但现在它没有做我想要的。基本上，我只想在我从下拉列表中选择时显示输入文本，并将其保留在屏幕上。如果这是您的实际HTML，您应该关闭您的输入标记。这不会解决您的问题，但这是另一个更正。您是否添加了我在顶部澄清的包装标签？

$(document).ready(function() {
    $('#shipping').change(function() {
        if ( $("#shipping").val ()  ==  "LA") 
        {                              
            $('#mydiv').removeClass('hidden');
        }
        else
            $("#mydiv").addClass('hidden');
    }); 
});

 $(document).ready(function() {
 $("#mydiv").hide();

var shipLocation = $("select#shipping").val();
if ( shipLocation ==  "LA") 
    {                              
        $('#mydiv').show();
    }