根据菜单选择显示/隐藏表单输入字段

我想要根据菜单选项来加载某些输入隐藏字段数据。但我无法使用下面的代码。你能帮我找出我要去哪里吗？我想尝试让这个代码工作。根据菜单选择显示/隐藏表单输入字段

我目前在标头中有这个javascript。

<script type="text/javascript"> 
    function toggle() { 
     //alert(thing.options[thing.selectedIndex].innerHTML); 
     var w = document.getElementById("pt").selectedIndex; 
     var selected_text = document.getElementById("pt").options[w].text; 
     if (selected_text == "Home") { 
      //alert(selected_text) 
      document.getElementById("hiddenbox").innerHTML = '<input type="hidden" name="sfrType[]" value="RES-Single Family"><input type="hidden" name="sfrType[]" value="RES-Farm-Ranch">' 
     } else if (selected_text == "Lot") { 
      // alert(selected_text) 
      document.getElementById("hiddenbox").innerHTML = '<input type="hidden" id="amin_acres" name="amin_acres" value="0.001">' 
     } else if (selected_text == "Acreage") { 
      //alert(selected_text) 
      document.getElementById("hiddenbox").innerHTML = '<input type="hidden" name="amin_acres" value="2">' 
     } else { 
      document.getElementById("hiddenbox").innerHTML = ''; 
     } 
    } 
</script>

这里的场形状菜单的html：

<select name="pt" id="pt" onChange="toggle()" size="5" multiple="multiple"> 
    <option value="sfr" selected="selected">Home</option> 
    <option value="ld">Lot</option> 
    <option value="ld">Acreage</option> 
    <option value="com">Commercial</option> 
</select>

所以如果选择Acreage，然后输入隐藏字段<input type="hidden" name="amin_acres" value="2">将加载。它曾经工作，然后停止工作。

来源

2015-07-10 sven30

一定要加在div

<div id="hiddenbox"></div>

<script type="text/javascript"> 
function toggle() { 
//alert(thing.options[thing.selectedIndex].innerHTML); 
var w = document.getElementById("pt").selectedIndex; 
var selected_text = document.getElementById("pt").options[w].text; 
if (selected_text == "Home") { 
    //alert(selected_text) 
    document.getElementById("hiddenbox").innerHTML = '<input name="sfrType[]" value="RES-Single Family"><input type="hidden" name="sfrType[]" value="RES-Farm-Ranch">' 
    } 
else if (selected_text == "Lot") { 
    // alert(selected_text) 
    document.getElementById("hiddenbox").innerHTML = '<input id="amin_acres" name="amin_acres" value="0.001">' 
    } 
else if (selected_text == "Acreage") { 
    //alert(selected_text) 
    document.getElementById("hiddenbox").innerHTML = '<input name="amin_acres" value="2">' 
} else { 
    document.getElementById("hiddenbox").innerHTML =''; 
} 
} 

</script>

来源

2015-07-10 23:09:07

hiddenbox div在哪里？此外，表单字段需要隐藏，但在表单提交时基于菜单选择进行处理。这些输入字段只会出现在背景html中，并且不会向提交表单的用户显示。 – sven30

我不得不在测试项目中尝试代码，并且完美地工作，一定是别的错误，也许用你的db –

是的，我发现在头文件代码中有2个切换。现在所有人都在工作。谢谢！ – sven30

似乎你失去了#hiddenbox元素。

<div id="hiddenbox"></div> 
<select name="pt" id="pt" onChange="toggle()" size="5" multiple="multiple"> 
    <option value="sfr" selected="selected">Home</option> 
    <option value="ld">Lot</option> 
    <option value="ld">Acreage</option> 
    <option value="com">Commercial</option> 
</select>

否则代码工作正常。

来源

2015-07-10 22:41:18

您将类型隐藏为输入标记。因此，输入类型不会显示。另外，最好的做法是将输入标签用表格标签包装，如所示。我希望这有帮助！

来源

2015-07-10 22:45:37

它已经被包裹在一种形式。这只是表格的一部分。此外，隐藏的字段需要隐藏，但仍然得到表单提交的确认。只是不在形式上视觉上。 – sven30

根据菜单选择显示/隐藏表单输入字段

回答

相关问题