如何在我的情况下使用 jQuery 隐藏和显示?
Posted
技术标签:
【中文标题】如何在我的情况下使用 jQuery 隐藏和显示?【英文标题】:How to hide and show in my case using jQuery? 【发布时间】:2011-08-23 02:54:18 【问题描述】:我是 jQuery 的新手。我有一个 index.html 页面,
<body>
<div id="content">
</body>
我想要页面加载时,“内容”区域显示列表的功能:
<div id="my-list">
<select id="carlist" size="10">
<option>BMW</option>
<option>TOYOTA</option>
<option>SKODA</option>
</select>
</div>
当用户从列表选项中选择汽车时,列表“my-list
”消失(隐藏),并且图像将显示在“@987654324 @“ 区域。
隐藏选择字段并在同一“content
”区域显示图像。
如何在 jQuery 中做到这一点?
我试过了:
var mylist=$('#my-list');
mylist.change(function()
mylist.hide()
SOMEIMAGE.show()
但是,在哪里定义“my-list
”和image
在同一个“content
”区域?如何实现这一切?
【问题讨论】:
【参考方案1】:var mylist=$('#carlist');
mylist.change(function()
mylist.hide();
var container = mylist.parent();
container.find('img').remove();
container.append('<img src="x.jpg" />');
【讨论】:
【参考方案2】:mylist = $('#my-list');
mylist.change(function()
mylist.hide();
container = $('#content');
container.html('<img ... />');
);
不过,有很多方法可以显示新内容,例如 append()
,如果您不想覆盖 <div id="content" />
中的所有 html 代码,或者使用函数 toggle()
或show()
和 hide()
如果 <img />
已经存在。
此外,您还必须考虑知道change()
函数中选择了哪个选项并采取相应措施。
【讨论】:
以上是关于如何在我的情况下使用 jQuery 隐藏和显示?的主要内容,如果未能解决你的问题,请参考以下文章