Tôi sử dụng hộp chọn jquery để hiển thị/ẩn div. Điều này hoạt động, nhưng khi quay lại/nhấp để xóa giá trị tùy chọn (Chọn màu
), jquery sẽ không ẩn div cuối cùng.
JS:
$(document).ready(function(){ $("select").change(function(){ $( "tùy chọn chọn: đã chọn"). mỗi(function(){ if($(this).attr("value")=="red"){ $(".box").ẩn(); $(".red").show(); } if($(this).attr("value")=="green"){ $(".box").ẩn(); $(".green").show(); } if($(this).attr("value")=="blue"){ $(".box").ẩn(); $(".blue").show(); } }); }).thay đổi(); });
HTML:
Chọn màu Đỏ Xanh Màu xanh
Bạn đã chọn tùy chọn màu đỏ nên tôi ở đây
Bạn đã chọn tùy chọn xanh nên tôi ở đây
Bạn đã chọn tùy chọn màu xanh nên tôi ở đây
CSS:
.hộp{ phần đệm: 20px; display: none; lề trên: 20px; đường viền: 1px liền khối #000; } .red{ nền: #ff0000 } .green{ nền: #00ff00 } .blue{ nền: #0000ff }
如何解决这个问题?
演示:http://jsfiddle.net/9yR4f/
Tôi sẽ đơn giản hóa toàn bộ vấn đề thành:
$("select").change(function () { $('div.box').hide(); $('div.box.'+$(this).val()).show(); });
jsFiddle example
Tôi là một lập trình viên xuất sắc, rất giỏi!