jQuery实现dialog设置focus焦点的方法


Posted in Javascript onJune 10, 2015

本文实例讲述了jQuery实现dialog设置focus焦点的方法。分享给大家供大家参考。具体分析如下:

当弹出对话框,默认我们应该将焦点定位到输入的文本框,但是在dialog.show()之前写上$("#txtGroupName").focus();无法生效。

查看jQuery的官方文档后,发现dialog提供了一个focus的参数,ok,试试先~~

//显示新建项目群组对话框 
function showCreateProjectGroupDialog(i) { 
  $("#layout-createProjectGroup-pane").show().dialog({ 
    modal: true 
    , title: lmslang.listProjectGroup_Create 
    , width: 450 
    , overlay: { 
      opacity: 0.5 
    } 
    , focus: function(ev, data) { 
      $("#txtGroupName").focus(); 
    } 
    , buttons: { 
      "保存": function() { 
        var name = el("txtGroupName").value; 
        var description = el("txtDescription").value; 
        var b = $("#fgroup").valid(); 
        if (b) { 
          createGroupJson(); 
          closeCreateGroupDialog(); 
        } else { 
          showError(lmslang.formValidate_Error); 
        } 
      } 
      , "取消": function() { 
        closeCreateGroupDialog(); 
      } 
    } 
  }); 
} 
//隐藏新建项目群组对话框 
function closeCreateGroupDialog(){ 
  $("#layout-createProjectGroup-pane").dialog("close"); 
}

搞定!O(∩_∩)O..

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
基于jQuery的为attr添加id title等效果的实现代码
Apr 20 Javascript
JS实现CheckBox复选框全选全不选功能
May 06 Javascript
利用jQuery实现漂亮的圆形进度条倒计时插件
Sep 30 Javascript
javascript日期格式化方法汇总
Oct 04 Javascript
jQuery数据类型小结(14个)
Jan 08 Javascript
javascript中的面向对象
Mar 30 Javascript
vue引用js文件的多种方式(推荐)
May 17 Javascript
深入了解javascript 数组的sort方法
Jun 01 Javascript
Angular2中监听数据更新的方法
Aug 31 Javascript
浅谈Vue render函数在ElementUi中的应用
Sep 06 Javascript
socket在egg中的使用实例代码详解
May 30 Javascript
javascript实现简单页面倒计时
Mar 02 Javascript
jQuery替换textarea中换行的方法
Jun 10 #Javascript
简介JavaScript中getUTCMonth()方法的使用
Jun 10 #Javascript
JavaScript中getUTCMinutes()方法的使用详解
Jun 10 #Javascript
在JS中操作时间之getUTCMilliseconds()方法的使用
Jun 10 #Javascript
jQuery获取页面元素绝对与相对位置的方法
Jun 10 #Javascript
Javascript中的getUTCHours()方法使用详解
Jun 10 #Javascript
jQuery实现首页图片淡入淡出效果的方法
Jun 10 #Javascript
You might like
PHP的Laravel框架中使用AdminLTE模板来编写网站后台界面
2016/03/21 PHP
php HTML无刷新提交表单
2016/04/05 PHP
PHP编程获取各个时间段具体时间的方法
2017/05/26 PHP
JavaScript学习小结(7)之JS RegExp
2015/11/29 Javascript
JavaScript的Backbone.js框架入门学习指引
2016/05/07 Javascript
jQuery通过ajax快速批量提交表单数据
2016/10/25 Javascript
jQuery中ajax错误调试分析
2016/12/01 Javascript
Vue.js第三天学习笔记(计算属性computed)
2016/12/01 Javascript
jquery 追加元素append、prepend、before、after用法与区别分析
2016/12/02 Javascript
js实现一个猜数字游戏
2017/03/31 Javascript
webpack打包单页面如何引用的js
2017/06/07 Javascript
基于Bootstrap分页的实例讲解(必看篇)
2017/07/04 Javascript
Vue源码解析之Template转化为AST的实现方法
2018/12/14 Javascript
关于layui的动态图标不显示的解决方法
2019/09/04 Javascript
JavaScript JSON使用原理及注意事项
2020/07/30 Javascript
[07:55]2014DOTA2 TI正赛第三日 VG上演推进荣耀DKEG告别
2014/07/21 DOTA
python BeautifulSoup使用方法详解
2013/11/21 Python
Django在Win7下的安装及创建项目hello word简明教程
2014/07/14 Python
Python查找第n个子串的技巧分享
2018/06/27 Python
python实现定时压缩指定文件夹发送邮件
2020/12/22 Python
获取Pytorch中间某一层权重或者特征的例子
2019/08/17 Python
配置python的编程环境之Anaconda + VSCode的教程
2020/03/29 Python
树莓派升级python的具体步骤
2020/07/05 Python
python 写一个水果忍者游戏
2021/01/13 Python
三星新西兰官网:Samsung新西兰
2019/03/05 全球购物
爱情检讨书大全
2014/01/21 职场文书
医务工作者先进事迹材料
2014/01/26 职场文书
厉行勤俭节约倡议书
2014/05/16 职场文书
质量保证书怎么写
2015/02/27 职场文书
幼师求职自荐信
2015/03/26 职场文书
2015年村党支部工作总结
2015/04/30 职场文书
结婚幸福感言
2015/08/01 职场文书
用CSS3画一个爱心
2021/04/27 HTML / CSS
Python的这些库,你知道多少?
2021/06/09 Python
聊聊基于pytorch实现Resnet对本地数据集的训练问题
2022/03/25 Python
springboot入门 之profile设置方式
2022/04/04 Java/Android