jQuery Dialog 打开时自动聚焦的解决方法(两种方法)

下面给大家介绍两种方法解决jQuery Dialog 打开时自动聚焦问题。具体实现方法大家可以参考下本文。

方法一：

p1_dialog_seniorSearch.dialog({
title:"高级查询",
autoOpen:false,//默认关闭
modal: true,//开启遮罩层
width:570,
height:330,
buttons: {
"查询":function(){
seniorSearch(1,20)
} ,
"关闭": function() {
p1_dialog_seniorSearch.dialog( "close" );
}
},
open:function(event, ui){
$(this).parent().focus();
}//取消获取焦点
});

方法二：

在要焦点的的控件加上 autofocus

如：第一个控件为 datepicker，默认dialog打开会自动弹出日历

解决：在该dialog加个隐藏input,

<input type="hidden" autofocus/>

未加 autofocus，dialog不会聚焦影藏的input的。

PS： jquery dialog打开的时候,自动聚焦在第一个控件上

在做项目的时候，用到jQuery dialog,在dialog(“open”)一个页面的时候，焦点会自动聚焦到第一个控件上，刚好这个控件绑定了datepicker，就把日历自动弹出来了，纠结半天无果，google了一下，有人也遇到同样的问题。先给出解决方案

<input autofocus> 在标签上加一个autofocus属性就能给指定的控件获取焦点。比如第一个是日期控件，那么把这个属性加到其他标签上去，第一个日历控件就不会聚焦，也就不会弹出来了。话说回来，这个方法有点类似于障眼法。

附上解决问题的网址：

http://stackoverflow.com/questions/1202079/prevent-jquery-ui-dialog-from-setting-focus-to-first-textbox

http://jqueryui.com/upgrade-guide/1.10/#added-ability-to-specify-which-element-to-focus-on-open

以上所述是小编给大家介绍的jQuery Dialog 打开时自动聚焦的解决方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对我们网站的支持！

赞 (0)

相关推荐

  • jQuery弹出框代码封装DialogHelper

    看了jQueryUI Dialog的例子,效果还不错,就是用起来有点儿别扭,写出的代码有点拧巴,需要再封装一下!于是就有了下面这个简单的DialogHelper辅助类,因为这篇文章分享的重点是思路,所以目前版本的代码也还非常粗糙.思路对了,后续再封装成什么样都不过是形式而已,希望这个思路能给大家点启迪,同时欢迎大家开拓思维,提出更好的改进意见. 复制代码 代码如下: //require ScrollHelper.js function DialogHelper() {     var _this

  • jQuery前端框架easyui使用Dialog时bug处理

    jQuery前端框架easyui使用Dialog时bug处理

    最近一直都在用easyui前端框架来开发设计UI,但在使用Dialog时,发现如果页面内容比较多,就会出现问题,首先看一下我的原代码: 复制代码 代码如下: <input type="button" value="确认预约" id="btnconfirm" onclick="javascript:openconfirmDlg();" />     <div id="confirmd">

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

    本文实例讲述了jQuery实现dialog设置focus焦点的方法.分享给大家供大家参考.具体分析如下: 当弹出对话框,默认我们应该将焦点定位到输入的文本框,但是在dialog.show()之前写上$("#txtGroupName").focus();无法生效. 查看jQuery的官方文档后,发现dialog提供了一个focus的参数,ok,试试先~~ //显示新建项目群组对话框 function showCreateProjectGroupDialog(i) { $("#l

  • jQuery UI库中dialog对话框功能使用全解析

    对话框(dialog),是jQuery UI 非常重要的一个功能.它彻底的代替了JavaScript 的alert().prompt()等方法,也避免了新窗口或页面的繁杂冗余. 一．开启多个dialog    只要设置不同的id 即可实现. $('#x').dialog(); $('#y').dialog(); 二．修改dialog 样式    在弹出的dialog 对话框中,在火狐浏览器中打开Firebug 或者右击->查看 元素.可以看看dialog 的样式,对dialog 的标题背景进行修

  • jQuery EasyUI Dialog拖不下来如何解决

    使用jquery easyui可以很容易的创建很炫的前台页面,最近在使用过程中发现dialog存在一个问题: 用户将dialog拖出页面后,dialog就不能拖下来了,除非要重新打开页面,这个问题对于用户体验来说是非常重要的, 所以就开始研究easyu API看看有没有相应的函数或者事件去处理,结果发现没有现成,只好自己想了个办法: 思路如下: 使用panel的onOpen事件,取得diglog的原始left和top 当用户在拖动dialog过程中,使用panel的onMove事件取得dialo

  • jquery ui dialog替代confirm实例分析

    本文实例讲述了jquery ui dialog替代confirm的方法.分享给大家供大家参考,具体如下: js的confirm,有的浏览器会直接屏蔽掉,导致功能无法使用,推荐使用jquery ui 的dialog功能,完美替换confirm功能 1.html代码 <div id="confirm_dialog" title="提示" style="display:none;"> </div> 把上面代码放到公用的地方 2.

  • 分享2个jQuery插件--jquery.fileupload与artdialog

    分享2个jQuery插件--jquery.fileupload与artdialog

    这些是我们项目中必不可少的东西,所以今天推荐两个一个叫做artdialog是个iframe的jquery插件,一个叫jquery file upload,我看网上很少有这个插件jquery file upload的插件使用教程,今天我就简单的介绍和写一点使用的方法! 简单用代码举例子 最小化的方法 复制代码 代码如下: data-url是上传后执行上传文件的php方法 <input id="fileupload" type="file" name="

  • jQuery Dialog 打开时自动聚焦的解决方法(两种方法)

    下面给大家介绍两种方法解决jQuery Dialog 打开时自动聚焦问题.具体实现方法大家可以参考下本文. 方法一: p1_dialog_seniorSearch.dialog({ title:"高级查询", autoOpen:false,//默认关闭 modal: true,//开启遮罩层 width:570, height:330, buttons: { "查询":function(){ seniorSearch(1,20) } , "关闭"

  • jquery的ajax提交form表单的两种方法小结(推荐)

    jquery的ajax提交form表单的两种方法小结(推荐) 方法一: function AddHandlingFeeToRefund() { var AjaxURL= "../OrderManagement/AjaxModifyOrderService.aspx"; alert($('#formAddHandlingFee').serialize()); $.ajax({ type: "POST", dataType: "html", url:

  • django中使用jquery ajax post数据出现403错误的解决办法(两种方法)

    在django中,使用jquery ajax post数据,会出现403的错误 方法一: 如果用jQuery来处理ajax的话,Django直接送了一段解决问题的代码.把它放在一个独立的js文件中,在html页面中都引入即可.注意这个js文件必须在jquery的js文件引入之后,再引入即可 $(document).ajaxSend(function(event, xhr, settings) { function getCookie(name) { var cookieValue = null;

  • PHP中file_get_contents函数抓取https地址出错的解决方法(两种方法)

    方法一: 在php中,抓取https的网站,提示如下的错误内容: Warning: file_get_contents() [function.file-get-contents]: failed to open stream: Invalid argument in I:Webmyphpa.php on line 16 打开php.ini文件找到 ;extension=php_openssl.dll ,去掉双引号";" ,重启web服务器即可. apache服务器的话,可以同时启用m

  • PHP yii实现model添加默认值的方法(两种方法)

    yii实现model添加默认值的方法(2种方法) 这篇文章主要介绍了yii实现model添加默认值的方法,结合实例分析了在rules()方法及在beforeSave()方法中设定两种实现技巧,对大家也许有帮助, 本文实例讲述了yii实现model添加默认值的方法.分享给大家供大家参考,具体如下: yii model 继承自CActiveRecord 有些字段可能不会出现在表单中,而需要在程序中加入.如订单编号,时间戳,操作的user_id等等. 以下二种方法: 1.在rules()方法中设定:

  • python操作日志的封装方法(两种方法)

    前言 曾经转载过一篇关于python日志模块logging的详解 https://www.cnblogs.com/linuxchao/p/linuxchao-log.html, 虽然这篇文章是别人写的, 但是我就是靠着这篇文章入门的logging,所以我觉得没必要再继续说些理论的东西,今天就简单的对日志做个封装,实际工作中直接拿去用吧 方法1 """ ------------------------------------ @Time : 2019/5/22 8:12 @Au

  • 微信小程序动态的显示或隐藏控件的方法(两种方法)

    微信小程序动态的显示或隐藏控件的方法(两种方法)

    在微信小程序开发时,经常要用到一个控件会根据不同的情况和环境动态显示与隐藏这种情况,下面就来实践一把!上效果先 它的实现方法有两种, 第一种方法:单选法,就是隐藏与显示根据条件二选一,代码如下: <view class="{{showView?'bright789_view_show':'bright789_view_hide'}}"> <text class="bright789-text">我是被显示被隐藏控件</text>

  • Linux在shell中自动生成1到100的数组方法(两种方法)

    之前自己在写shell脚本的时候,需要自动创建1-100的文本确不知道该如何去创建.百度一翻终于知道了创建的方法. 在shell脚本中创建1-100的方法很多,那我在这里主要就说两种容易理解且方便的方法: 第一种方法: for i in {1..100} do echo $i done 使用{1..100}这种方式简单明了,大家也可以在linux命令模式下直接:echo {1..100}看一下效果. 第二种方法: 使用seq函数 for i in `seq 1 100` do echo $i d

  • 使用IntelliJ IDEA 进行代码对比的方法(两种方法)

    使用IntelliJ IDEA 进行代码对比的方法(两种方法)

    Sometimes,我们会有这样的需求,即:想对比出两个不同版本代码的区别.如何实现? 第 1 种:如果我们是从 SVN 检出的项目,并且想比较本地代码与从 SVN 检出时的代码相比都有那些区别,可以按如下步骤操作, 如上图所示,在代码编辑区,右键唤出功能菜单,然后选择Subversion,进而会展示出更多的可选项,例如: Compare with the Same Repository Version,与 SVN 仓库相同版本做对比: Compare with Latest Repositor

  • 打开和关闭mysql服务的两种实现方法

    方法一:使用cmd命令 首先,打开我们的dos窗口,开始-运行-输入cmd. 如上图所示,输入net start mysql 回车即可启动,输入net stop mysql 回车即可关闭. 方法二:选择计算机(我的电脑)右击鼠标,选择管理,在选择系统和应用服务下面的服务. 找到MySQL,右击选择启动或停止.如图: 以上内容就是打开和关闭mysql服务的两种方法,希望能给大家一个参考,也希望大家多多支持我们.

随机推荐