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 解析读取XML文档 实例代码
Jul 07 Javascript
13个绚丽的Jquery 界面设计网站推荐
Sep 28 Javascript
JS 实现导航栏悬停效果
Sep 23 Javascript
js设置组合快捷键/tabindex功能的方法
Nov 21 Javascript
解决angular的post请求后SpringMVC后台接收不到参数值问题的方法
Dec 10 Javascript
javascript RegExp 使用说明
May 21 Javascript
AngularJs基于角色的前端访问控制的实现
Nov 07 Javascript
Angular 2父子组件数据传递之@Input和@Output详解(下)
Jul 05 Javascript
Vue中正确使用jQuery的方法
Oct 30 jQuery
jquery拖拽自动排序插件使用方法详解
Jul 20 jQuery
vue指令之表单控件绑定v-model v-model与v-bind结合使用
Apr 17 Javascript
js实现文章目录索引导航(table of content)
May 10 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 配置open_basedir 让各虚拟站点独立运行
2009/11/12 PHP
php 模拟 asp.net webFrom 按钮提交事件实例
2014/10/13 PHP
兼容ie和firefox js关闭代码
2008/12/11 Javascript
JavaScript在IE和Firefox浏览器下的7个差异兼容写法小结
2010/06/18 Javascript
JS删除数组元素的函数介绍
2013/03/27 Javascript
js通过元素class名字获取元素集合的具体实现
2014/01/06 Javascript
jQuery中offsetParent()方法用法实例
2015/01/19 Javascript
JavaScript如何动态创建table表格
2020/08/02 Javascript
基于jquery实现动态竖向柱状条特效
2016/02/12 Javascript
基于jQuery的checkbox全选问题分析
2016/11/18 Javascript
Node.js测试中的Mock文件系统详解
2016/11/21 Javascript
angularjs实现简单的购物车功能
2017/09/21 Javascript
nodejs连接mysql数据库及基本知识点详解
2018/03/20 NodeJs
Vue使用watch监听一个对象中的属性的实现方法
2019/05/10 Javascript
JavaScript如何获取一个元素的样式信息
2019/07/29 Javascript
express框架下使用session的方法
2019/07/31 Javascript
JavaScript浅层克隆与深度克隆示例详解
2020/09/01 Javascript
[51:26]VP vs VG 2018国际邀请赛小组赛BO2 第二场 8.19
2018/08/21 DOTA
Python生成pdf文件的方法
2014/08/04 Python
Python多线程编程(三):threading.Thread类的重要函数和方法
2015/04/05 Python
python+opencv实现动态物体识别
2018/01/09 Python
python3 pandas 读取MySQL数据和插入的实例
2018/04/20 Python
Python通过cv2读取多个USB摄像头
2019/08/28 Python
Python高级编程之消息队列(Queue)与进程池(Pool)实例详解
2019/11/01 Python
Python输出指定字符串的方法
2020/02/06 Python
Tensorflow 1.0之后模型文件、权重数值的读取方式
2020/02/12 Python
pandas DataFrame 数据选取,修改,切片的实现
2020/04/24 Python
使用SimpleITK读取和保存NIfTI/DICOM文件实例
2020/07/01 Python
某个公司的Java笔面试题
2016/03/11 面试题
标记环网Toke Ring IEEE802.5
2014/05/26 面试题
Linux面试题LINUX系统类
2015/11/25 面试题
本科生学习总结的自我评价
2013/10/02 职场文书
简历的自我评价
2014/02/03 职场文书
2015年董事长秘书工作总结
2015/07/23 职场文书
2016入党积极分子心得体会
2016/01/06 职场文书
pytorch 运行一段时间后出现GPU OOM的问题
2021/06/02 Python