jQuery事件 mouseover方法与mouseout方法实现鼠标移进显示移出消失的效果 (css控制span标签)

<script>
  $(function(){
    var text ;
  $(".pos span").each(function(){
    text = $(this).text().trim();
  if(text=="设为默认"){
    $(this).css(‘display‘,‘none‘);
    }
  });

  $(".pos").mouseover(function(){  //鼠标移进显示效果
    text = $(this).find(‘span‘).text().trim();
  if(text=="设为默认"){
   $(this).find(‘span‘).css(‘display‘,‘‘);
   }
  }).mouseout(function(){   //鼠标移出消失效果
    text = $(this).find(‘span‘).text().trim();
  if(text=="设为默认"){
    $(this).find(‘span‘).css(‘display‘,‘none‘);
    }
  });
});

function deform(obj){
  var id = obj.id
  var text = $("#"+id).text().trim();
  if(text==‘设为默认‘){
    //获取数据id
    var addressId = id.replace(/[^0-9]/ig,"");  //匹配获取id
    $.post(‘/UserCenter/setAddress‘,
  {
    id:addressId
  },function(data,textStatus){
    $(".pos[id!="+id+"]").find(‘span‘).text("设为默认").css(‘display‘,‘none‘);
    $("#"+id).find(‘span‘).text("默认地址");
    });
  }
}

<td width="140"  class="pos" onclick="deform(this)" id=‘def_<?php echo $val[‘id‘]?>‘><span style="cursor:pointer"><?php echo $val[‘default_a‘] == 1 ?"默认地址":"设为默认"?></span></td>

</script>

//处理默认地址
public function setAddressAction(){
  if(isset($_SERVER["HTTP_X_REQUESTED_WITH"]) && strtolower($_SERVER["HTTP_X_REQUESTED_WITH"])=="xmlhttprequest"){ // ajax 请求的处理方式
    $id = $_POST[‘id‘];
    $model = $this->model(‘Address‘);
    $sql = "update address set default_a = 0 where default_a = 1";
    $model->execute($sql);
    $sql = "update address set default_a = 1 where id=".$id;
    $model->execute($sql);
    echo "success";
  }else{ // 正常请求的处理方式
    header("HTTP/1.1 404 Not Found");exit;
  };
}

jQuery事件 mouseover方法与mouseout方法实现鼠标移进显示移出消失的效果 (css控制span标签)

时间: 2024-10-12 15:35:13

jQuery事件 mouseover方法与mouseout方法实现鼠标移进显示移出消失的效果 (css控制span标签)的相关文章

jQuery事件对象的属性和方法

jQuery事件对象的属性和方法 事件对象的属于与方法有很多,但是我们经常用的只有那么几个,这里我主要说下作用与区别 event.type:获取事件的类型 触发元素的事件类型 $("a").click(function(event) { alert(event.type); // "click"事件 }); event.pageX 和 event.pageY:获取鼠标当前相对于页面的坐标 通过这2个属性,可以确定元素在当前页面的坐标值,鼠标相对于文档的左边缘的位置(

jQuery 二级菜单,一次显示一个小类 鼠标点击显示小类

jQuery 二级菜单,一次显示一个小类 鼠标点击显示小类 本例有另外2个关联案例,演示地址分别为2.php,3.php 演示 XML/HTML Code <div class="arrowlistmenu"> <h3 class="menuheader expandable">表单</h3> <ul class="categoryitems"> <li><a href="

jQuery事件绑定的四种方法

jQuery中提供了四种绑定事件的方法,分别是bind.live.delegate.on,对应的解除监听的函数分别是unbind.die.undelegate.off: 一.on()方法(首选方法) on() 方法在被选元素及子元素上添加一个或多个事件处理程序. 自 jQuery 版本 1.7 起,on() 方法是 bind().live() 和 delegate() 方法的新的替代品.该方法给 API 带来很多便利,我们推荐使用该方法,它简化了 jQuery 代码库. 参数: event:必需

jQuery 事件对象的属性和方法

event.pageX 和 event.pageY:获取鼠标当前相对于页面的坐标 通过这 2 个属性,可以确定元素在当前页面的坐标值,鼠标相对于文档的左边缘的位置(左边)与 (顶边)的距离,简单来说是从页面左上角开始, 即是以页面为参考点, 不随滑动条移动而变化 event.preventDefault() 方法:阻止默认行为 这个用的特别多,在执行这个方法后,如果点击一个链接(a 标签),浏览器不会跳转到新的 URL 去了.我们可以用 event.isDefaultPrevented() 来确

鼠标移上与移出事件

$('#newcl').hover(function(){                     $("#newcl").hide();                     $("#popDiv").show(                         function(){                             $("#popDiv").hover(function(){                      

jQuery事件绑定on()、bind()、live()与delegate() 方法详解

jQuery事件绑定有四个方法,对应为on,off,bind,unbind,delegate,undelegate,live,die 比较和联系: 1.bind()函数只能针对已经存在的元素进行事件的设置:但是live(),on(),delegate()均支持未来新添加元素的事件设置: 2.bind()函数在jquery1.7版本以前比较受推崇,1.7版本出来之后,官方已经不推荐用bind(),替代函数为on(),这也是1.7版本新添加的函数,同样,可以 用来代替live()函数,live()函

WEB入门之十四 jQuery事件

学习内容 ? jQuery各种事件 ? jQuery事件绑定 能力目标 ? 能熟练使用jQuery各种事件 ? 能熟练绑定jQuery事件 本章简介 JavaScript是事件驱动型的编程语言,即JavaScript和HTML之间的交互是通过用户和浏览器操作页面时触发的事件来驱动进行的.使用传统的JavaScript就能处理这些交互,但是jQuery增加并扩展了JavaScript事件处理机制,使其使用起来更加优雅和灵活.本章我们重点讲解jQuery中的各种事件以及事件的绑定. 核心技能部分 5

jquery 事件--鼠标事件

一.click( )  与 dblclick() --双击 click事件其实是由mousedown与mouseup 2个动作构成,所以点击的动作只有在松手后才触发 在同一元素上同时绑定 click 和 dblclick 事件是不可取的. $(".div").click(function(){ alert("hello") }) $('p').click(function(e) { alert(e.target.textContent); // 打印所点击对象的文本

jquery事件之事件

事件名 说明 语法 (events 事件类型,data数据,handler 事件处理函数,selector 选择器) blur() 获得失去鼠标光标焦点事件 jQueryObject.blur( [ [ data ,]  handler ] ) change() 在文本内容或选项被更改时触发.该事件仅适用于<input type="text">和<textarea>以及<select> jQueryObject.change( [ [ data ,]