JQuery

引用 JQuery 文件满足功能实现;

<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

HTML

创建页面实现内容;
<div class="showMyLove">…</div> 为控制的对象 div 层,可个单个,也可以是多个,通过 toggle() 实现同时响应事件,非常方便应用在遍历数据后返回的多个条目结果的显示控制;
class="showMyLove" 对应 JS 文件的 toggle() 开关;
myFunction() 激活按钮事件;

<div class="showMyLove">enjoyJQuery</div>
<div class="showMyLove">enjoyJQuery</div>
<div class="showMyLove">enjoyJQuery</div>
<div class="showMyLove">enjoyJQuery</div>
<div class="showMyLove">enjoyJQuery</div>

<button onclick="myFunction()">show</button>

CSS

将主体内容配置为预先样式,如果默认显示,将无需先行设置,如下为预先将内容隐藏;

.showMyLove{
    display: none;
}

JS

创建功能实现事件脚本路径。

function myFunction(){
    $('.showMyLove').toggle();
}

友情提示:本站所有文章,如无特殊说明或标注,均为何星星原创发布。与此同时,趋于近年来本站的文章内容频繁被他站盗用与机器采集,现已全局禁用网站文字内容操作,了解详情或转载文章请 点此 继续!

0 条评论

发表回复

Avatar placeholder

您的电子邮箱地址不会被公开。 必填项已用 * 标注