jquery的插件

最新推荐文章于 2022-10-14 12:16:41 发布

六楼外的风景

最新推荐文章于 2022-10-14 12:16:41 发布

阅读量651

点赞数

分类专栏： javascript 文章标签： jquery javascript function class button div

本文链接：https://blog.csdn.net/yangfanend/article/details/6731111

版权

javascript 专栏收录该内容

16 篇文章 0 订阅

订阅专栏

jquery.form表单提交：

<script language="javascript" src="jquery.min.js"></script>
<script language="javascript" src="jquery.form.js"></script>
<script language="javascript">
$(function(){
	$("input[type=button]:eq(0)").click(function(){
		var options = {
			target: "#myTargetDiv"
		};
		//ajax一步上传表单
		$("#myForm").ajaxSubmit(options);
	});
});
</script>
</head>
<body>
<form id="myForm" name="myForm" action="15-4.aspx">
<table cellspacing="0" id="formTable">
<tr><td>用户</td><td><input name="Name" type="text"></td></tr>
<tr><td>密码</td><td><input name="Password" type="password"></td></tr>
<tr><td colspan="2" align="center"><input type="button" name="ajaxSub" value="AjaxSubmit">
<input type="submit" name="Sub" value="NormalSubmit">
</td></tr>
</table>
</form>
<div id="myTargetDiv"></div>
</body>

jquery拖拽效果：

<script language="javascript" src="jquery.ui/jquery-1.2.4a.js"></script>
<script language="javascript" src="jquery.ui/ui.base.min.js"></script>
<script language="javascript" src="jquery.ui/ui.draggable.min.js"></script>
<script language="javascript">
$(function(){
	for(var i=0;i<3;i++){
		//添加三个透明的<div>块
		$(document.body).append($("<div class='block'>Div"+i.toString()+"</div>").css("opacity",0.6));
	}
	//直接调用拖拽方法
	$(".block").draggable();
});
</script>

购物车：

<script language="javascript" src="jquery.ui/jquery-1.2.4a.js"></script>
<script language="javascript" src="jquery.ui/ui.base.min.js"></script>
<script language="javascript" src="jquery.ui/ui.draggable.min.js"></script>
<script language="javascript" src="jquery.ui/ui.droppable.min.js"></script>
<script language="javascript">
$(function(){
	$(".draggable").draggable({helper:"clone"});
	$("#droppable-accept").droppable({
		accept: function(draggable){
			//接收类别为green的
			return $(draggable).hasClass("green");
		},
		drop: function(){
			$(this).append($("<div></div>").html("drop!"));
		}
	});
});
</script>
</head>
<body>
<div class="draggable red">draggable red</div>
<div class="draggable green">draggable green</div>
<div id="droppable-accept" class="droppable">droppable<br></div>
</body>

六楼外的风景

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery的插件

jquery.form表单提交：$(function(){ $("input[type=button]:eq(0)").click(function(){ var options = { target: "#myTargetDiv" };
复制链接

扫一扫