默认隐藏一部分内容,点击展开显示更多,这种效果jquery怎么做

默认隐藏一部分内容,点击展开显示更多,这种效果jquery怎么做,第1张

这个功能其实很容易实现,我在这告诉你思路一个思路和步骤:

1、把要显示的原样输出,作为更多要隐藏的内容你就用style="display:none"属性把它先隐藏;

2、给查看更多绑定点击事件,点击后show你要展示的内容;

实际代码如下:html 代码

Jquery代码:

扩展资料

jQuery是一个快速、简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架)。jQuery设计的宗旨是“write Less,Do More”,即倡导写更少的代码,做更多的事情。它封装JavaScript常用的功能代码,提供一种简便的JavaScript设计模式,优化HTML文档 *** 作、事件处理、动画设计和Ajax交互。

jQuery的核心特性可以总结为:具有独特的链式语法和短小清晰的多功能接口;具有高效灵活的css选择器,并且可对CSS选择器进行扩展;拥有便捷的插件扩展机制和丰富的插件。jQuery兼容各种主流浏览器,如IE 60+、FF 15+、Safari 20+、Opera 90+等。

参考资料:

百度百科 jQuery

可以说清楚点吗?是想要div隐藏还是自定义一个属性不显示呢?

如果是隐藏div就直接:$("div")hide();或者添加css:$("div")css("display","none");

如果是添加自定义属性不显示那么属性名称尽量不要和元素本来有的一样:

$("div")attr("varid","21321");

jQuery 获取 input 文本框中的值方法始终是相同的,与是否隐藏无关,隐藏与不隐藏都能获取到值;

<div id="thisdiv" style="display: none">

<input type="text" class="demo" id="demo" value="123213e2q">

</div>

<script>

var value = $('#demo')val(); // 直接根据 input 的id 获取值

var value = $('demo')val(); // 根据input 的class 类获取值,此方法需保证只有一个input 使用该class 类,否则始终返回第一个使用该class 类的input 的值

var value = $('#thisdiv input')val(); //

var value = $('#thisdiv demo')val(); // 根据父元素定位input 获取值

以上的方法都能获取到 input 中的值,与div 是否隐藏没关系

</script>

hidden表单的值仍然可以用val方法获取,举例如下

<input type="hidden" id="test" value="hiddenValue" />

取值使用val方法:

$('#test')val();//hiddenValue

扩展:

val()方法获取匹配的元素集合中第一个元素的当前值。

val()方法主要用于获取表单元素的值,比如 input, select 和 textarea。

得用jquery这样的插件方式来处理吧,选择器 $("tr:visible input[type=text]") 即可, 不然相当相当麻烦。

当然 $("tr:visible input[type=text]") 返回的是一个input集合,需要遍历处理。可先用

alert($("tr:visible input[type=text]")size());

看看所有输入框的数量是否准确。

以上就是关于默认隐藏一部分内容,点击展开显示更多,这种效果jquery怎么做全部的内容,包括:默认隐藏一部分内容,点击展开显示更多,这种效果jquery怎么做、使用jquery怎样给div加个隐藏属性呢、jquery 如何获取隐藏div中Input中的文本框值等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9626705.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-04-30
下一篇 2023-04-30

发表评论

登录后才能评论

评论列表(0条)

保存