当我们选择使用JavaScript隐藏/显示下拉列表和/或文本框内容时，请清除这些内容_Javascript_Php_Html

当我们选择使用JavaScript隐藏/显示下拉列表和/或文本框内容时，请清除这些内容

javascript php html

当我们选择使用JavaScript隐藏/显示下拉列表和/或文本框内容时，请清除这些内容,javascript,php,html,Javascript,Php,Html,当我从选择框中选择选项时，我想显示下拉列表或文本框下拉框，我在其中选择一个选项： <div class="form-group"> <label class="col-sm-4 control-label">Lessor Name</label> <div class="col-sm-7"> <select onchange="showDiv(this)" class="form-control" i

当我从选择框中选择选项时，我想显示下拉列表或文本框

下拉框，我在其中选择一个选项：

<div class="form-group">
    <label class="col-sm-4 control-label">Lessor Name</label>
        <div class="col-sm-7">
        <select onchange="showDiv(this)" class="form-control" id="lessor_name" name="lessor_name" required>
            <option value=""> -- Select -- </option>
            <option value="Company">Company</option>
            <option value="Vendor">Vendor</option>
        </select>
        </div>
</div>

当我选择供应商时，将出现div

<div class="form-group" name="vendor_vehicle" id="vendor_vehicle" style="display:none;">
    <label class="col-sm-4 control-label">Vendor Vehicle Num</label>
    <div class="col-sm-7">
       <input type="text" class="form-control" id="vendor_vehicle_num" name="vendor_vehicle_num" >
    </div>
</div>

上面提到的代码对我来说非常有用。但问题是，当我第一次选择供应商并将在文本框中键入任何文本时，如果我希望在下拉列表中选择公司，则插入的文本将在供应商文本框中保持不变

如果选择了供应商中的文本框和公司中通过JavaScript选择的下拉框，如何清除它们

提前感谢您

我认为您引用了错误的ID。试试这个，如果可以的话告诉我

<!DOCTYPE html>
<html>
<style>
</style>

<body>
<div class="form-group">
    <label class="col-sm-4 control-label">Lessor Name</label>
        <div class="col-sm-7">
        <select onchange="showDiv(this)" class="form-control" id="lessor_name" name="lessor_name" required>
            <option value=""> -- Select -- </option>
            <option value="Company">Company</option>
            <option value="Vendor">Vendor</option>
        </select>
        </div>
</div>

<div class="form-group" name="vehiclelist" id="vehiclelist" style="display:none;">
    <label class="col-sm-4 control-label">Vehicle Number</label>
    <div class="col-sm-7">
    <select class="form-control" id="vehicle_list" name="vehicle_list" >
        <option value=""> -- Select -- </option>
        <option value="1">One</option>
        <option value="2">Two</option>
    </select>                                               
    </div>
</div>

<div class="form-group" name="vendor_vehicle" id="vendor_vehicle" style="display:none;">
    <label class="col-sm-4 control-label">Vendor Vehicle Num</label>
    <div class="col-sm-7">
       <input type="text" class="form-control" id="vendor_vehicle_num" name="vendor_vehicle_num" >
    </div>
</div>

</body>
<script>

function showDiv(select){
 if(select.value=="Company"){
  document.getElementById('vehiclelist').style.display = "block";
 } else{
  document.getElementById('vehiclelist').style.display = "none";

 }
 if(select.value=="Vendor"){
  document.getElementById('vendor_vehicle').style.display = "block";
  document.getElementById('vendor_vehicle_num').value="";
 } else{
  document.getElementById('vendor_vehicle').style.display = "none";
 document.getElementById('vendor_vehicle').value="";
 }
 }
</script>

</html>

我想你引用了错误的身份证。试试这个，如果可以的话告诉我

<!DOCTYPE html>
<html>
<style>
</style>

<body>
<div class="form-group">
    <label class="col-sm-4 control-label">Lessor Name</label>
        <div class="col-sm-7">
        <select onchange="showDiv(this)" class="form-control" id="lessor_name" name="lessor_name" required>
            <option value=""> -- Select -- </option>
            <option value="Company">Company</option>
            <option value="Vendor">Vendor</option>
        </select>
        </div>
</div>

<div class="form-group" name="vehiclelist" id="vehiclelist" style="display:none;">
    <label class="col-sm-4 control-label">Vehicle Number</label>
    <div class="col-sm-7">
    <select class="form-control" id="vehicle_list" name="vehicle_list" >
        <option value=""> -- Select -- </option>
        <option value="1">One</option>
        <option value="2">Two</option>
    </select>                                               
    </div>
</div>

<div class="form-group" name="vendor_vehicle" id="vendor_vehicle" style="display:none;">
    <label class="col-sm-4 control-label">Vendor Vehicle Num</label>
    <div class="col-sm-7">
       <input type="text" class="form-control" id="vendor_vehicle_num" name="vendor_vehicle_num" >
    </div>
</div>

</body>
<script>

function showDiv(select){
 if(select.value=="Company"){
  document.getElementById('vehiclelist').style.display = "block";
 } else{
  document.getElementById('vehiclelist').style.display = "none";

 }
 if(select.value=="Vendor"){
  document.getElementById('vendor_vehicle').style.display = "block";
  document.getElementById('vendor_vehicle_num').value="";
 } else{
  document.getElementById('vendor_vehicle').style.display = "none";
 document.getElementById('vendor_vehicle').value="";
 }
 }
</script>

</html>

只有一个可以选择-所以只有一个可以显示@ Kirataka。如果任何答案都解决了你的问题，请考虑点击复选标记。这向更广泛的社区表明，你已经找到了一个解决方案，并给回答者和你自己带来了一些声誉。没有义务这样做。只有一个可以选择-所以只有一个可以显示@ Kirataka。如果任何答案都解决了你的问题，请考虑点击复选标记。这向更广泛的社区表明，你已经找到了一个解决方案，并给回答者和你自己带来了一些声誉。没有义务这么做，是的。你说得对，兄弟。我在JS中传递了错误的ID。非常感谢。现在开始工作了。你说得对，兄弟。我在JS中传递了错误的ID。非常感谢。现在开始工作了。

<!DOCTYPE html>
<html>
<style>
</style>

<body>
<div class="form-group">
    <label class="col-sm-4 control-label">Lessor Name</label>
        <div class="col-sm-7">
        <select onchange="showDiv(this)" class="form-control" id="lessor_name" name="lessor_name" required>
            <option value=""> -- Select -- </option>
            <option value="Company">Company</option>
            <option value="Vendor">Vendor</option>
        </select>
        </div>
</div>

<div class="form-group" name="vehiclelist" id="vehiclelist" style="display:none;">
    <label class="col-sm-4 control-label">Vehicle Number</label>
    <div class="col-sm-7">
    <select class="form-control" id="vehicle_list" name="vehicle_list" >
        <option value=""> -- Select -- </option>
        <option value="1">One</option>
        <option value="2">Two</option>
    </select>                                               
    </div>
</div>

<div class="form-group" name="vendor_vehicle" id="vendor_vehicle" style="display:none;">
    <label class="col-sm-4 control-label">Vendor Vehicle Num</label>
    <div class="col-sm-7">
       <input type="text" class="form-control" id="vendor_vehicle_num" name="vendor_vehicle_num" >
    </div>
</div>

</body>
<script>

function showDiv(select){
 if(select.value=="Company"){
  document.getElementById('vehiclelist').style.display = "block";
 } else{
  document.getElementById('vehiclelist').style.display = "none";

 }
 if(select.value=="Vendor"){
  document.getElementById('vendor_vehicle').style.display = "block";
  document.getElementById('vendor_vehicle_num').value="";
 } else{
  document.getElementById('vendor_vehicle').style.display = "none";
 document.getElementById('vendor_vehicle').value="";
 }
 }
</script>

</html>