<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>下拉列表左右选择</title> <script type="text/javascript" src="../js/jquery-1.8.3.min.js" ></script> <script> $(function(){ /*bind方法关于传参的用法*/ function leftToRight(obj){ alert(obj.data); alert(obj.data.key1); alert(obj.data.key2); var a =obj.data.key1; var b =obj.data.key2; $(a).appendTo($(b)); } var leftToRight= function (obj){ alert(123); alert(obj.data.key1); alert(obj.data.key2); var a =obj.data.key1; var b =obj.data.key2; $(a).appendTo($(b)); } /*调用函数的时候一定不能有()*/ $("a:first").bind("click",{key1:'select:first option:selected',key2:'select:last'},leftToRight); }); </script> </head> <body> <table border="1" width="600" align="center"> <tr> <td> 分类名称 </td> <td> <input type="text" name="cname" value="手机数码"/> </td> </tr> <tr> <td> 分类描述 </td> <td> <textarea name="cdesc" rows="4" cols="20">手机数码类商品</textarea> </td> </tr> <tr> <td> 分类商品 </td> <td> <span style="float: left;"> <font color="green" face="宋体">已有商品</font><br/> <select multiple="multiple" style="width: 100px;height: 200px;" > <option selected="selected">IPhone6s</option> <option>小米4</option> <option>锤子T2</option> </select> <p><a href="#" style="padding-left: 20px;" >>></a></p> <p><a href="#" style="padding-left: 20px;" >>>></a></p> </span> <span style="float: right;"> <font color="red" face="宋体">未有商品</font><br/> <select multiple="multiple" style="width: 100px;height: 200px;" > <option>三星Note3</option> <option>华为6s</option> </select> <p><a href="#" ><<</a></p> <p><a href="#" ><<<</a></p> </span> </td> </tr> <tr> <td colspan="2"> <input type='submit' value="修改"/> </td> </tr> </table> </body> </html>
jquery中的bind事件,详解,传参
博客分类: 前端技巧
jquery中的bind事件,详解,传参
第一个,关于这句的解释:
$(window).bind('load.jcarousel', function() { windowLoaded = true; });
1. 一次可以绑定多个事件。如:
2. 任何作为type参数的字符串都是合法的;如果一个字符串不是原生的JavaScript事件名,那么这个事件处理函数会绑定到一个自定义事件上。这些自定义事件绝对不会由浏览器触发,但可以通过使用.trigger()或者.triggerHandler()在其他代码中手动触发。
3. 如果type参数的字符串中包含一个点(.)字符,那么这个事件就看做是有命名空间的了。这个点字符就用来分隔事件和他的命名空间。如:
$obj.bind('click.name', handler) 那么字符串中的 click 是事件类型,而字符串 name 就是命名空间。
第二个,传递参数以及一些特殊用法
首先是传递参数:
特殊用法:
使用在submit上的click
还有没看明白的:
还有一些方法可以取消默认行为和阻止事件起泡:preventDefault 和stopPropagation
第一个,关于这句的解释:
$(window).bind('load.jcarousel', function() { windowLoaded = true; });
1. 一次可以绑定多个事件。如:
- $('#foo').bind({
- click: function() {
- // do something on click
- },
- mouseenter: function() {
- // do something on mouseenter
- }
- );
2. 任何作为type参数的字符串都是合法的;如果一个字符串不是原生的JavaScript事件名,那么这个事件处理函数会绑定到一个自定义事件上。这些自定义事件绝对不会由浏览器触发,但可以通过使用.trigger()或者.triggerHandler()在其他代码中手动触发。
3. 如果type参数的字符串中包含一个点(.)字符,那么这个事件就看做是有命名空间的了。这个点字符就用来分隔事件和他的命名空间。如:
$obj.bind('click.name', handler) 那么字符串中的 click 是事件类型,而字符串 name 就是命名空间。
第二个,传递参数以及一些特殊用法
首先是传递参数:
- 1.<script>
- 2.function showAlert(events){
- 3. alert(events.data.foo);
- 4.}
- 5.$('#myBtn').bind('click',{foo:'click'},showAlert);
- 6.</script>
特殊用法:
使用在submit上的click
- <script> $('#myBtn').bind('click',function(){ return false; }) </script>
还有没看明白的:
还有一些方法可以取消默认行为和阻止事件起泡:preventDefault 和stopPropagation
- 1.<script>
- 2.$('#myBtn').bind('click',function(event){
- 3.event.preventDefault();//取消默认的click行为
- 4.});
- 5.$('#myBtn').bind('click',function(event){
- 6.event.stopPropagation();//阻止click事件起泡
- 7.});
- 8.
- 9.</script>