`
ruby8
  • 浏览: 206408 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

jquery对div显示和隐藏

    博客分类:
  • html
 
阅读更多
<div id="divObj" style="display:none">
1.测试例子<br/>
2.测试例子<br/>
</div>
<input type="button" value="隐藏" onclick="hiden()"/>
<input type="button" value="显示" onclick="show()"/>
 
 
<script type="text/javascript">
function hiden()
{
$("#divObj").hide();
}
 
function show()
{
$("#divObj").show();
}
</script>

 

 

 

 

1:需要引入jquery

 

2:若input换为a标签,可以这样

 

<a href="javascript:void(0);" onclick="show()" >展开</a>

 

<a href="javascript:void(0);" onclick="hide()"  >收起</a>

 

分享到:
评论

相关推荐

    jQuery显示隐藏DIV简单实例.zip

    本实例主要关注如何利用jQuery实现显示和隐藏DIV元素的功能,这是一种常见的页面交互手法,特别是在内容展示和空间管理上。 首先,理解基本的HTML结构。在网页中,我们通常会有一个或多个`&lt;div&gt;`元素,它们是用来...

    JQuery-DIV弹窗

    这种效果通过CSS样式实现背景变灰,通过jQuery控制DIV的显示和隐藏,以及响应用户的关闭操作。 首先,我们需要创建一个HTML结构,包含一个隐藏的DIV作为弹窗容器,以及必要的触发按钮: ```html &lt;!DOCTYPE html&gt; ...

    jquery_div.rar_div显示特效_jquery_div

    本教程将深入探讨如何利用jQuery实现层(div)的显示与隐藏特效,以创建更加动态和交互性的用户体验。 首先,我们需要理解HTML中的`&lt;div&gt;`元素。`&lt;div&gt;`是一个块级元素,常用于组织页面布局或作为内容的容器。通过...

    完美的鼠标放上去jquery显示隐藏层

    在网页设计和开发中,交互性是提升用户体验的关键因素之一,而“完美的鼠标放上去jquery显示隐藏层”正是实现这种交互效果的一种技术手段。这个标题所指的是一种使用JavaScript库jQuery来实现在鼠标悬停(hover)时...

    Div显示与隐藏网页制作

    在"Div显示与隐藏网页制作"这个主题中,我们将探讨如何利用`Div`实现网页元素的动态显示和隐藏,这对于创建交互式和响应式的网页至关重要。 在网页设计中,有时我们需要根据用户的行为或者特定条件来控制某些内容的...

    jquery+div实现同时滑动切换的图文展示特效插件下载.rar

    这些div通常会被隐藏,只显示一个初始的div。 2. **CSS样式**:通过CSS定义div的宽高、位置和其他样式,确保它们可以按照预期进行滑动。 3. **jQuery事件绑定**:使用jQuery的`.click()`或`.on('click')`方法监听...

    JavaScript 动态隐藏、显示DIV 页面刷新后也不会改变隐藏状态

    使用JQUERY做的一个页面DIV动态隐藏 显示 点击+号图片后 DIV会自动隐藏 点击-号图片后 DIV会自动显示 隐藏的DIV区域内的控件值后台仍可以取得到,当页面刷新时,也不会改变隐藏区域的隐藏状态 使用JQUERY将页面状态...

    jquery之超简单的div显示和隐藏特效demo(分享)

    接下来,我们来看一下如何使用jQuery控制`div`元素的显示和隐藏。在JavaScript部分,定义了四个函数:`hiden()`, `slideToggle()`, `show()`, 和 `toggle()`,这些函数分别对应不同的显示和隐藏效果。 1. `hiden()`...

    jquery模拟div多选checkbox下拉框

    这可能包括初始化方法(如`.initSelectBox()`),设置和获取值的方法(如`.setValue()`, `.getValue()`),以及显示和隐藏下拉框的方法(如`.show()`, `.hide()`)。 6. **可访问性和兼容性**:考虑到不同的浏览器和...

    div显示隐藏效果

    总之,`div`的显示隐藏效果是前端开发中的基本技巧,它涉及到HTML、CSS和JavaScript的综合运用。掌握这一技能可以帮助开发者更好地控制网页的交互性和用户体验。通过不断学习和实践,你可以创造出更多富有创意的显示...

    JqueryUI控制可拖动隐藏DIV

    而 `hide()` 和 `show()` 方法则分别用于隐藏和显示元素,这使得用户可以根据需要随时显示或隐藏页面上的某个部分,如一个包含信息的 DIV 区域。 在描述中提到的“样式可调”,意味着我们可以自定义 DIV 的外观,...

    jquery实现div模块轮播切换

    自动播放可以通过设置定时器实现,页码指示器可以通过创建和更新相应元素来显示当前的slide索引,而动画效果则可以使用jQuery的`animate`方法来平滑过渡。 此外,还可以考虑添加键盘事件监听,允许用户通过左右箭头...

    利用jquery制作层的隐藏与显示

    本教程将深入讲解如何利用jQuery来实现层(div元素)的隐藏与显示效果,这对于创建交互式的网页界面至关重要。 首先,我们需要引入jQuery库。在这个例子中,我们有两个JavaScript文件:`jquery.js`和`to.js`。`...

    jquery div 弹出框

    以下将详细讲解如何实现jQuery div弹出框,包括基本概念、实现方法和相关技巧。 一、基本概念 1. 模态窗口:模态窗口是一种阻止用户与页面其他部分交互,直到关闭该窗口后才能继续操作的对话框。在网页中,常以div...

    div模拟下拉菜单(select)jquery插件.gz

    在这个"div模拟下拉菜单(select)jquery插件.gz"压缩包中,包含的就是这样一个基于`div`和jQuery的自定义下拉菜单解决方案。 首先,`demo.html`是演示页面,它展示了如何在实际项目中应用这个插件。这个页面会包含一...

    jquery实现隐藏和显示实例

    除了`hide()`和`show()`,还有其他一些相关的函数,如`toggle()`,它可以在隐藏和显示之间切换元素: ```javascript $element.toggle(); ``` 如果你需要根据某些条件来决定隐藏或显示元素,可以结合使用`if`语句:...

    jquery插件弹出div

    "jquery插件弹出div"是一个基于jQuery的插件,用于创建弹出式对话框或者模态框,通常用于显示警告、确认消息或者进行表单提交等交互操作。在网页设计中,这种功能能够提升用户体验,因为它可以将用户注意力集中在...

    ajax控制div窗口显示和隐藏

    三、Ajax控制Div显示 要使用Ajax来控制div的显示,首先需要在JavaScript中创建一个Ajax请求。在接收到服务器响应后,根据返回的数据决定是否显示或隐藏特定的div。例如,服务器可能返回一个JSON对象,其中包含一个...

    jquery仿div透明模态弹出窗

    在jQuery中,我们可以利用自定义的div元素来模拟这种弹出窗,并通过CSS控制其样式,包括透明度和位置。关键在于,我们需要添加一个背景层(通常称为遮罩层),这个遮罩层覆盖整个页面,使得用户只能与弹出窗交互。 ...

Global site tag (gtag.js) - Google Analytics