Jquery 控制元素 上 下 移动
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript" > function up(obj) {
var parenttr=$(obj).parent();//找到该li
var zhi = parenttr.find("input:hidden").val();
var zhi1 = parseFloat(zhi) - ;
var parentpre=parenttr.prev();//获得匹配元素中每个元素紧邻的前一个同胞元素
if (parentpre.length > ) {
parenttr.find("input:hidden").val(zhi1);//赋值自己
parenttr.prev().find("input:hidden").val(zhi);
parentpre.insertAfter(parenttr);//在被选元素之后插入 HTML 标记或已有的元素
}
} function down(obj) {
var parenttr=$(obj).parent();//找到该li
var zhi = $(obj).parent().find("input:hidden").val();
var zhi1 = parseFloat(zhi) + ;
var parentpre=parenttr.next();//查找每个段落的下一个同胞元素
if (parentpre.length > ) {
parenttr.find("input:hidden").val(zhi1);//赋值自己
parenttr.next().find("input:hidden").val(zhi);
parentpre.insertBefore(parenttr);//被选元素之前插入 HTML 标记或已有的元素
// $.post('/Text/common.ashx', { }, function(d) {})//这里可以触发ajax更新数据库中的排序号
}
}
</script> </head> <body> <ul>
<li><i></i> <input type="text" name="name" value="" /><input type="hidden" name="sort" value=""><span onclick="up(this)">上移</span> <span onclick="down(this)">下移</span></li>
<li><i></i> <input type="text" name="name" value="" /><input type="hidden" name="sort" value=""><span onclick="up(this)">上移</span> <span onclick="down(this)">下移</span></li>
<li><i></i> <input type="text" name="name" value="" /><input type="hidden" name="sort" value=""><span onclick="up(this)">上移</span> <span onclick="down(this)">下移</span></li>
</ul> </body>
</html>
<?php
if($_POST){
$a = $_POST['a'];
$b = $_POST['b'];
$c = $a + $b;
sleep();//延时3秒
echo json_encode($c);
exit;
}
?>
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>商会圈</title>
<script src="jquery.js" type="text/javascript"></script>
<script type="text/javascript">
function FunAjax()
{
$.ajax({
type: "POST",
url: "arr.php",
data: "a=1&b=9",
beforeSend: function(){
$("#span_content").html("数据处理中...");
},
success: function(msg){
$("#span_content").html("两个数的和为: " + msg);
}
});
}
</script>
</head>
<body>
<div style="font-size:12px; padding-left:15px; padding-top:15px;">
<input type="button" id="btn_ok" value="测试" onclick="FunAjax()" />
<span id="span_content">显示结果</span> </div>
</body>
</html>
<html>
<head>
<script src="jquery-1.3.2.min.js" type="text/javascript"></script>
</head>
<body>
<input type="checkbox" name="chk_list" id="chk_list_1" value="" /><br />
<input type="checkbox" name="chk_list" id="chk_list_2" value="" /><br />
<input type="checkbox" name="chk_list" id="chk_list_3" value="" /><br />
<input type="checkbox" name="chk_list" id="chk_list_4" value="" /><br />
<input type="checkbox" name="chk_all" id="chk_all" />全选/取消全选
<script type="text/javascript">
$("#chk_all").click(function(){
$("input[name='chk_list']").attr("checked",$(this).attr("checked"));
});
</script>
</body>
</html> jQuery.attr 获取/设置对象的属性值,如:
$("input[name='chk_list']").attr("checked"); //读取所有name为'chk_list'对象的状态(是否选中)
$("input[name='chk_list']").attr("checked",true); //设置所有name为'chk_list'对象的checked为true
再如:
$("#img_1").attr("src","test.jpg"); //设置ID为img_1的<img>src的值为'test.jpg'
$("#img_1").attr("src"); //读取ID为img_1的<img>src值 <script type="text/javascript">
//获取到所有name为'chk_list'并选中的checkbox(集合)
var arrChk=$("input[name='chk_list]:checked");
//遍历得到每个checkbox的value值
for (var i=;i<arrChk.length;i++)
{
alert(arrChk[i].value);
}
</script> 下面是用$.each()遍历的代码: <script type="text/javascript">
var arrChk=$("input[name='chk_list']:checked");
$(arrChk).each(function(){
window.alert(this.value);
});
});
</script>
<!DOCTYPE=html>
<html>
<head>
<script src="js/jquery.js" type="text/javascript"></script> <script type="text/javascript">
$(document).ready(function(){
var range = ; //距下边界长度/单位px
var elemt = ; //插入元素高度/单位px
var maxnum = ; //设置加载最多次数
var num = ;
var totalheight = ;
var main = $("#content"); //主体元素
$(window).scroll(function(){
var srollPos = $(window).scrollTop(); //滚动条距顶部距离(页面超出窗口的高度)
//console.log("滚动条到顶部的垂直高度: "+$(document).scrollTop());
//console.log("页面的文档高度 :"+$(document).height());
//console.log('浏览器的高度:'+$(window).height());
totalheight = parseFloat($(window).height()) + parseFloat(srollPos);
if(($(document).height()-range) <= totalheight && num != maxnum) {
main.append("<div style='border:1px solid tomato;margin-top:20px;color:#ac"+(num%)+(num%)+";height:"+elemt+"' >hello world"+srollPos+"---"+num+"</div>");
num++;
}
});
});
</script>
</head>
<body>
<div id="content" style="height:960px">
<div id="follow">this is a scroll test;<br/> 页面下拉自动加载内容</div>
<div style='border:1px solid tomato;margin-top:20px;color:#ac1;height:800' >hello world test DIV</div>
</div>
</body>
</html>
Jquery 文本框输入内容,自动匹配select 下拉框内容
<?php
include('config.inc.php');
header('Content-Type: text/html; charset=utf-8');
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>CPWEB</title>
<script type="text/javascript" src="jquery-1.8.js"></script>
<script>
$(document).ready(function(){
$("#username").change(function(){
var username=$(this).val();
$("#sidSpan").load("city.php?username="+username);
});
})
</script>
</head>
<body>
<form name="myform" id="myform" action="" method="post">
<input type="text" name="username" id="username" />
<span id="sidSpan">
<select id="sid" name="sid" style=" height:30px;"> </select>
</span>
</form>
</div>
</body>
</html> city.php 代码如下:
<?php
include('conn.php');
header('Content-Type: text/html; charset=utf-8'); $username = getParam('username', 'GET');
$sql="select * from `member` where username like '%$username%' order by id asc";
$query=mysql_query($sql);
while($row=mysql_fetch_array($query)){
$fid[]=$row;
}
?>
<select id="sid" name="sid">
<?php
foreach($fid as $k=>$v){
?>
<option value='<?php echo $v['id']?>'><?php echo $v['username']?></option>
<?php
}
?>
</select>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery实现购物车物品数量的加减</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script>
$(function(){
var t = $("#text_box");
$("#add").click(function(){
t.val(parseInt(t.val())+)
setTotal();
})
$("#min").click(function(){
t.val(parseInt(t.val())-)
setTotal();
})
function setTotal(){
$("#total").html((parseInt(t.val())*3.95).toFixed());
}
setTotal();
})
</script>
</head>
<body>
<p>单价:3.95</p>
<input id="min" name="" type="button" value="-" />
<input id="text_box" name="" type="text" value="" />
<input id="add" name="" type="button" value="+" />
<p>总价:<label id="total"></label></p>
</body>
</html>
Jquery 控制元素 上 下 移动的更多相关文章
- 如何使用T-SQL备份还原数据库及c#如何调用执行? C#中索引器的作用和实现。 jquery控制元素的隐藏和显示的几种方法。 localStorage、sessionStorage用法总结 在AspNetCore中扩展Log系列 - 介绍开源类库的使用(一) span<T>之高性能字符串操作实测
如何使用T-SQL备份还原数据库及c#如何调用执行? 准备材料:Microsoft SQL Server一部.需要还原的bak文件一只 一.备份 数据库备份语句:user master backup ...
- jQuery获取元素上一个、下一个、父元素、子元素
jQuery.parent(expr),找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(&q ...
- 用Jquery控制元素的上下移动 实现排序功能
在页面上,控制元素上下移动,进行排序是我们比较常用的功能,今天我用jQuery 写个 简单方便,功能齐全的实现方式. 话不多说,直接上代码,下面是基础的引入jq和html元素部分: <scrip ...
- jQuery控制元素隐藏和显示
1.jQuery隐藏和显示效果 通过 jQuery,您可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素: $("#hide").click(functio ...
- jquery控制元素的隐藏和显示的几种方法。
组织略显凌乱,请耐心看! 使用jquery控制div的显示与隐藏,一句话就能搞定,例如: 1.$("#id").show()表示为display:block, $("#i ...
- jquery控制元素的隐藏和显示的几种方法
使用jquery控制div的显示与隐藏,一句话就能搞定,例如: 方法一 显示: $("#id").show()表示为display:block, 隐藏: $("#id&q ...
- jQuery 判断元素上是否绑定了事件
我研究了一下之后发现,jQuery都将事件缓存起来了,其实也是为了防止内存溢出以及页面unload的时候的速度,也包括多函数触发,方便管理等诸多好处,具体可以参考此文. jQuery会在window. ...
- jquery控制元素的淡入淡出切换
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- jQuery控制元素显示、隐藏、切换、滑动的方法
jQuery 隐藏和显示 通过 hide() 和 show() 两个函数,jQuery 支持对 HTML 元素的隐藏和显示: 实例 $("#hide").click(functio ...
随机推荐
- Linux入门(二)Linux基本命令及基本操作
1 常用Linux命令 图形界面进入到字符界面: ctrl+alt+F2~F6 字符界面进入到图形界面:ctrl +alt+F7 查看本机ip: ifconfig (windows是:ipconf ...
- 调用短信接口,先var_dump()看数据类型是object需要json_decode(json_encode( $resp),true)转换成array
返回的数据.先看类型,如果是object类型 先json_encode, 再json_decode,加true 转换成数组 $resp = $c->execute($req); var_dump ...
- LeetCode OJ 39. Combination Sum
Given a set of candidate numbers (C) and a target number (T), find all unique combinations in C wher ...
- NFS挂载故障卡死的问题
NFS挂载故障卡死的问题 默认是硬的,改成软的.比如:mount -t nfs -o rw,vers=4,noacl,nocto,noatime,nodiratime,rsize=131072,wsi ...
- python--tile函数
1.函数的定义与说明 tile函数位于python模块 numpy.lib.shape_base中,功能是重复某个数组.比如tile(A,n),功能是将数组A重复n次,构成一个新的数组. 2.函数操作 ...
- SpringMvc+thymeleaf+HTML5中文乱码问题
SpringMvc+thymeleaf+HTML5环境下遇到中文乱码...... 按照以往经验逐个排查,开发环境统一为utf-8编码,服务器也配置了编码过滤器,tomcat也是utf-8编码.前台页面 ...
- elipse图标注解
Java中的访问修饰符(访问控制符)包括:public,protected,default,private.分别代表了不同的访问权限.如果省略,则被视为使用了默认的default作为访问修饰符.从字面 ...
- c语言结构体指针必须初始化
先说结论 结构体指针需要初始化 结构体指针的成员指针同样需要初始化 结构体变量定义的时候就已经分配了内存空间,而上面两个确没有 struct test{ int i; struct buf *p;} ...
- Position & anchorPoint 深入
引言 相信初接触到CALayer的人都会遇到以下几个问题: 为什么修改anchorPoint会移动layer的位置?CALayer的position点是哪一点呢?anchorPoint与positio ...
- UVALive 2520 Holedox Moving(BFS+状态压缩)
这个题目在比赛的时候我们是没有做出来的,但是听到他们说进制哈希的时候,感觉真的是挺高端的,于是赛后开始补题,本着我的习惯在看题解之前自己再试着写一遍,我当时存储状态的方法是string + map,我 ...