Cách ẩn thẻ đã chọn?

Tôi có hình thức đơn giản này:Cách ẩn thẻ đã chọn?

<form method="post" action="index.php" > 
<table> 

<tr> 
<td> 
Sex: 
</td> 
<td> 
    <select name="sex" > 
    <option value="e">Select </option> 
    <option value="girl">Girl </option> 
    <option value="boy">Boy </option> 
    </select> 
</td> 
</tr> 

<tr> 
<td> 
Accessories: 
</td> 
<td> 
    <select name="earrings" > 
    <option value="e">Select </option> 
    <option value="gold">gold </option> 
    <option value="silver">silver </option> 
    </select> 
</td> 
</tr> 


</table> 

<br> 
<input type="submit" size="10" value="Go" name="go"> 
</form>

và tôi muốn rằng khi tôi bấm vào "cậu bé" trong lần đầu tiên chọn sau đó khối này phải dissapears:

<tr> 
<td> 
Accessories: 
</td> 
<td> 
    <select name="earrings" > 
    <option value="e">Select </option> 
    <option value="gold">gold </option> 
    <option value="silver">silver </option> 
    </select> 
</td> 
</tr>

tôi có thể làm điều này với CSS ? Nếu không, tôi có thể làm điều này với javascript?

Nguồn

2010-12-12 xRobot

CSS, no; JavaScript, vâng. Liệu nó có phải là vani JavaScript, hay bạn có thể sử dụng một thư viện (như jQuery, MooTools, Prototype, Scriptaculous, Glow ..)? –

Bạn không thể làm điều này trong CSS, nhưng bạn có thể trong JavaScript

function hide(){ 
var earrings = document.getElementById('earringstd'); 
earrings.style.visibility = 'hidden'; 
} 

function show(){ 
var earrings = document.getElementById('earringstd'); 
earrings.style.visibility = 'visible'; 
}

Chỉ cần chắc chắn rằng bạn có tdid=earringstd

Sau đó tạo chức năng:

function genderSelectHandler(select){ 
if(select.value == 'girl'){ 
show(); 
}else if(select.value == 'boy'){ 
hide(); 
}}

Bây giờ tất cả bạn phải thay đổi thẻ giới tính của mình thành:

<select name="sex" onchange="genderSelectHandler(this)">

Nguồn

2010-12-12 18:21:55

vụng về, 'gender.form.earring.style.visibility = 'hidden'' hiện công việc –

Tôi đã tryed này nhưng không hoạt động: http://gooworld.altervista.org/ – xRobot

Có lẽ một lỗi cú pháp hoặc một số trong mã của tôi, tôi đã gõ nó từ đầu của tôi –

Thuộc tính ẩn ẩn lựa chọn nhưng thẻ vẫn được hiển thị và chiếm dung lượng trên trang.

Nếu bạn muốn ẩn một lựa chọn và không muốn nó xuất hiện ở tất cả, nhưng vẫn có thể tương tác với DOM, sau đây là một số mẫu mã:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title></title> 

<script type="text/javascript"> 

     function hide(){ 
      var elem = document.getElementById('sel1'); 
      elem.style.display = 'none'; 
     } 

     function show(){ 
      var elem = document.getElementById('sel1'); 
      elem.style.display = 'inline'; 
     } 

</script> 

</head> 
<body> 
    <form id="form1" runat="server"> 

     <select id='sel1' style='display:inline;'/> 

     <input type="button" onclick="show();" value="Show"></input><br> 
     <input type="button" onclick="hide();" value="Hide"></input><br> 

    </form> 
</body> 
</html>

Nguồn

2014-02-18 15:10:37

Tôi biết đây là một tuổi nhưng tôi thay đổi mã Goran như được liệt kê dưới đây và nghĩ rằng tôi sẽ chia sẻ. Điều này sụp đổ mã để nó không giữ lại không gian của nó trên trang, trong khi mã được liệt kê ở trên giữ tiếp tục giữ hình thức của nó nhưng trở nên vô hình.

function genderSelectHandler(select){ 
if(select.value == 'girl'){ 
$("#earringstd").show() 
}else{ 
$("#earringstd").hide(); 
}} 

<select name="sex" onchange="genderSelectHandler(this)">

Nguồn

2014-11-14 18:25:34 Crystal

Cách ẩn thẻ đã chọn?

Trả lời

Các vấn đề liên quan