- jquery如何实现点击一个按钮 div框从右→左,再点击按钮 div框从刚刚的位置移动回原来的位置?
- 框架结构是上、左、右,如何实现点击上部按钮,控制左侧菜单显示,并将左侧菜单第一个链接内容显示到右侧
- js如何使用框架实现WEB交互呢?(在一个框架内输入内容,点击按钮,另一框架接收内容)
- 点击左边框架(是用DIV做的)里面的按扭,在右边框架显示内容,用ASP.NET 做。
jquery如何实现点击一个按钮 div框从右→左,再点击按钮 div框从刚刚的位置移动回原来的位置?
1、新建一个html文件,命名为test.html。
2、在test.html文件内,使用div标签创建一行文字,文字内容为“小明”。
3、在test.html文件内,设置div标签的id属性为mytext,主要用于下面通过该id获得div对象。
4、在test.html文件内,使用button标签创建一个按钮,按钮名称为“切换内容”。
5、在test.html文件中,给button按钮绑定onclick点击事件,当按钮被点击时,执行func()函数。
6、在js标签中,创建func()函数,在函数内,通过id(mytext)获得div对象,通过html()方法获得div内的文本内容,使用if语句判断获得的文字内容是否为指定的文本内容,如果不是,则通过html()方法改变文本内容。
框架结构是上、左、右,如何实现点击上部按钮,控制左侧菜单显示,并将左侧菜单第一个链接内容显示到右侧
1、script的部分,这里我用jquery,比较方便,楼主的要求,如果是要从后台获取数据的话,还需要用到异步(ajax)和json.不过这里我只是处理了一下静态数据,希望对你有帮助
<script type="text/javascript" src="js/jquery-1.7.js"></script>
<script type="text/javascript">
$(function(){
$(".head button").click(function(){
$(".nav").css("display","block");
$(".first_content").css("display","block");
});
});
</script>
2、css部分,这个比较简单,一看就懂,
<style type="text/css">
body{padding:0px;margin:0px;}
.content{
margin:auto;
width:600px;
}
.head{
margin:auto;
width:600px;
height:100px;
background-color: pink;
}
.left{
float:left;
width:200px;
height:200px;
background-color: #fee;
}
.right{
float:left;
width:350px;
height:200px;
margin-left:20px;
background-color: #fde;
}
.left li{
display:none;
list-style:none;
}
.first_content,.second_content,.third_content{
display:none;
}
</style>
3、html部分
<div class="content">
<div class="head">
<button>点我试试</button>
</div>
<div class="left">
<li class="nav"><a href="#">第一个</a></li>
<li class="nav"><a href="#">第二个</a></li>
<li class="nav"><a href="#">第三个</a></li>
<li class="nav"><a href="#">第四个</a></li>
<li class="nav"><a href="#">第五个</a></li>
</div>
<div class="right">
<div class="first_content">
<p>aaa</p>
</div>
<div class="second_content">
<p>bbb</p>
</div>
<div class="third_content">
<p>ccc</p>
</div>
</div>
</div>
楼主可以把三个部分的代码,粘贴过去试试效果,记得导入jquery的包,改一下包的路径
js如何使用框架实现WEB交互呢?(在一个框架内输入内容,点击按钮,另一框架接收内容)
这个跟刚刚那个一样,,,提交的时候把你的值放到地址栏.或者记录到本地,,刷新的时候再获取就行了
好吧我理解错了 可以用document.parent 获取到父级框架 ,再到父级找到子集就行了
点击左边框架(是用DIV做的)里面的按扭,在右边框架显示内容,用ASP.NET 做。
left.aspx中链接的打开目标设置为right.aspx框架名称即可:
<a href="#" target="main">链接</a>