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 相关文章推荐
JavaScript中的History历史对象
Jan 16 Javascript
JavaScript对象模型-执行模型
Apr 28 Javascript
javascript使用location.search的示例
Nov 05 Javascript
JQuery操作iframe父页面与子页面的元素与方法(实例讲解)
Nov 20 Javascript
基于HTML5上使用iScroll实现下拉刷新,上拉加载更多
May 21 Javascript
原生js实现class的添加和删除简单代码
Jul 12 Javascript
vue中组件的3种使用方式详解
Mar 23 Javascript
vue实现PC端录音功能的实例代码
Jun 05 Javascript
layui异步加载table表中某一列数据的例子
Sep 16 Javascript
Vue.set 全局操作简单示例
Sep 19 Javascript
uni-app从安装到卸载的入门教程
May 15 Javascript
JS相册图片抖动放大展示效果的示例代码
Jan 29 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
双料怀旧--SHARP GF515的维护、修理和简单调试
2021/03/02 无线电
国外十大最流行的PHP框架排名
2013/07/04 PHP
php实现中文字符截取防乱码方法汇总
2015/04/29 PHP
PHP 返回数组后处理方法(开户成功后弹窗提示)
2017/07/03 PHP
Laravel框架Blade模板简介及模板继承用法分析
2019/12/03 PHP
PHP强制转化的形式整理
2020/05/22 PHP
cnblogs csdn 代码运行框实现代码
2009/11/02 Javascript
javascript中创建对象的三种常用方法
2010/12/30 Javascript
JavaScript设计模式之外观模式实例
2014/10/10 Javascript
javascript动画算法实例分析
2015/07/31 Javascript
基于Bootstrap实现下拉菜单项和表单导航条(两个菜单项,一个下拉菜单和登录表单导航条)
2016/07/22 Javascript
js利用appendChild对标签进行排序的实现方法
2016/10/16 Javascript
Angular 2父子组件数据传递之@Input和@Output详解(下)
2017/07/05 Javascript
详解react关于事件绑定this的四种方式
2018/03/09 Javascript
JS实现盒子跟着鼠标移动及键盘方向键控制盒子移动效果示例
2019/01/29 Javascript
js 执行上下文和作用域的相关总结
2021/02/08 Javascript
[01:20:37]FNATIC vs NIP 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
python函数缺省值与引用学习笔记分享
2013/02/10 Python
Python实现的爬取小说爬虫功能示例
2019/03/30 Python
keras绘制acc和loss曲线图实例
2020/06/15 Python
Python QT组件库qtwidgets的使用
2020/11/02 Python
AmazeUI框架搭建的方法步骤(图文)
2020/08/17 HTML / CSS
日本运动品牌美津浓官方购物网站:MIZUNO SHOP
2016/08/21 全球购物
韩国美国时尚服装和美容在线全球市场:KOODING
2018/11/07 全球购物
Moss Bros官网:英国排名第一的西装店
2020/02/26 全球购物
开办饭店创业计划书
2013/12/28 职场文书
求职信需要的五点内容
2014/02/01 职场文书
党员党性分析材料
2014/02/17 职场文书
开学寄语大全
2014/04/08 职场文书
投资意向书
2014/07/30 职场文书
出差报告格式模板
2014/11/06 职场文书
门店店长岗位职责
2015/04/14 职场文书
2015年社区矫正工作总结
2015/04/21 职场文书
2015年幼师个人工作总结
2015/10/15 职场文书
2016年优秀共青团员事迹材料
2016/02/25 职场文书
Nginx配置使用详解
2022/07/07 Servers