视图:

<tr data='{cid:"<?php echo $one['id']; ?>"}'><td width="40"><div class="dis"><img src="<?php echo Yii::app()->request->baseUrl; ?>/images/ico_edit.png" class="bt_modify" width="15" height="15"></div></td><td><span class="t"><?php echo $one['title']; ?></span><input type="text" class="input_s it" style="width:200px; display:none" value="<?php echo $one['title']; ?>"/></td></tr>

js:

  $(".tbody").mouseover(function(){$(this).find(".dis").show();                                       //鼠标移入行内图标显示}).mouseout(function(){$(this).find(".dis").hide();});                 //移出消失$(".bt_modify").click(function(){$(this).parent().parent().parent().find(".t").hide();               //点击图片原字段隐藏$(this).parent().parent().parent().find(".it").show().focus();     //显示并且选中input框});$(".it").blur(function(){$(this).hide();$(this).parent().find(".t").show();var data = eval('('+$(this).parent().parent().attr('data')+')');var cid = data.cid;var obj = $(this);var objSpan = $(this).parent().find(".t");var title = $.trim($(obj).val());var origin = $(objSpan).html();if (title == "") {$.messager.show({title:'提示',msg:'标题不能为空',showType:'fade',style:{right:'',bottom:''}});$(obj).val(origin);return false;}if (title == origin) {$(this).hide();$(this).parent().find(".t").show();} else {$.post('<?php echo Yii::app()->createUrl("content/edit") ?>',{'cid':cid,'title':title},function(data){if(data.code < 1){$.messager.alert("提示", data.message);} else {$(objSpan).html(title);$(obj).hide();$(objSpan).show();}},'json');}});

  

转载于:https://www.cnblogs.com/fengzhiqiangcaisangzi/p/3380965.html

后台无刷新修改字段js相关推荐

  1. 快速修改HTML5,HTML5无刷新修改URL(示例代码)

    HTML5新添加了两个api分别是pushState和replaceState,DOM中的window对象通过window.history方法提供了对浏览器历史记录的读取,可以在用户的访问记录中前进和 ...

  2. HTML5无刷新修改URL:利用 History API 无刷新更改地址栏

    为什么80%的码农都做不了架构师?>>>    HTML5 新增的历史记录 API 可以实现无刷新更改地址栏链接,配合 AJAX 可以做到无刷新跳转. 简单来说:假设当前页面为ren ...

  3. Php无刷新修改url,history 实现无刷新更改url和页面内容

    在访问google plus 和网易m站时,细心的用户也许会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发生了了改变.并且能够很好的支持浏览器的前进和后退.不禁让人想问,是什么有这么强 ...

  4. JS无刷新修改URL类似博客园翻页效果

    <script type="text/javascript">function changeURL(){var url = document.getElementByI ...

  5. JQuery Ajax后台无刷新验证用户名重复,前台验证两次密码一致,后台创建并验证 验证码

    写在前面 写web 的人,我想最先要解决的就是注册登录的界面了,一个小小的界面却包含着各种基本的知识,让我这个新手摸了一天. 效果图 知识 1.bootstrap渲染表单 2.JQuery ajax验 ...

  6. 无刷新修改页面的浏览器地址栏显示地址的方法

    作为一个Web程序员,我经常会到网上去看别人是如何做网站,如何开发Web应用的.这样的好处有很多,一是开阔你的眼界,你能看到很多书本上没有的东西,二是看别人的代码是如何写的,取人之长.补己之短.像纯C ...

  7. ECSHOP无刷新更新修改购物车数量,ecshop购物车数量更新

    ECSHOP商城购物的时候,如果想修改购物车里的商品数量,填写完新的数字后,还得再点一下"更新购物车"才行,这样给用户体验非常不好.这里只是提供另一种改进方案:利用AJAX无刷新修 ...

  8. HTML5网页页面无刷新更新页面URL

    HTML5可通过history.pushState修改网页的URL地址,在配合相关代码显示隐藏相应界面便可以实现单页面多界面相互操作.该方法比直接访问URL地址速度快,执行效率高,UI体验好,但会增加 ...

  9. 无刷新跳转—关于history中pushState和replaceState方法详解

    〝 古人学问遗无力,少壮功夫老始成 〞 **关于history中pushState和replaceState方法详解,**常码字不易,出精品更难,没有特别幸运,那么请先特别努力,别因为懒惰而失败,还矫 ...

最新文章

  1. LeetCode简单题之数组的度
  2. Maya摄像机动画技能学习教程
  3. 不得自行对涉密计算机进行格式化,保密资格认证-涉密人员考试试题
  4. Windows的启动u盘linux,如何在linux下制作一个windows的可启动u盘?
  5. CSDN总结的面试中的十大可视化工具
  6. PID算法搞不懂?看这篇文章。
  7. java 文件解析异常_java中异常的解析
  8. pycharm创建django项目linux部署
  9. 父子组建传值_浅谈Vue父子组件和非父子组件传值问题
  10. 棋牌游戏服务器设计(1)
  11. 如何打造程序员专属聊天室?
  12. 关于telnet的安装
  13. 浏览器内核选型列表,请大家继续补充
  14. VS2017 插件的安装目录
  15. Python人眼视线追踪系统
  16. python制作gif动图_PIL生成透明GIF动图
  17. C语言 将一个字符串转换为字符,每两个字符间用空格隔开
  18. 笑喷了,我用Python帮韦小宝选最佳老婆组合
  19. 百度地图分不同色块显示某个城市的行政区划,并添加城市(区)名
  20. 中央空调如何调节温度html,麦克维尔中央空调设置温度单位方法

热门文章

  1. python目标检测答案_你好,这里有一份2019年目标检测指南
  2. visual studio 2019 HTML怎么自动生成代码_敲代码和编程适合什么样的笔记本?深度推荐...
  3. 电脑卡顿不流畅是什么原因_为什么安卓系统用久了会卡,苹果系统却依然流畅?原因找到了!...
  4. 列表子集Python解法
  5. gettype拿不到值_拼多多场景实操——这样实操场景推广有效拿高投产【下篇】...
  6. 直接销毁_战机报废,发动机怎么处理?美国直接销毁,中国改造成扫雪神器
  7. 认知行为技术是计算机技术吗,基于认知行为模型的多Agent建模技术研究与应用_问答库...
  8. 联想e52进入bios_联想笔记本怎么设置u盘启动|联想笔记本bios设置usb启动步骤
  9. localhost使用ipv4_使用 blackbox exporter 实现域名证书过期监控
  10. python视图函数是什么_python之视图函数(views.py)