首页 JQuery/JavaScript ExtJS Ext.QuickTips.init() 属性说明

ExtJS Ext.QuickTips.init() 属性说明

作者:胡同里的砖头 围观群众:1420 更新于:2013-12-19

发现好多程序都在第一行使用了如下语句:

Ext.QuickTips.init();

但是QuickTips的用处是什么呢?

我们先来看下面的代码:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Html</title>
<body >
<a href="http://extjs.com" title="ExtJS官方网站">ExtJS</a>
<input type="text" title="请填写 ..."></input>
</body>
</html>



用IE打开后,把属标放到ExtJS上面,可以看到显示一个提示框,如下图:
点击在新窗口中浏览此图片

现在我们在来看下面这代码:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>ExtJS</title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>

<body >
<a href="http://extjs.com" ext:qtip="ExtJS官方网站">ExtJS</a>
<input type="text" ext:qtip="请填写 ..."></input>

<script type="text/javascript" charset="utf-8">
    Ext.onReady(function(){
        Ext.QuickTips.init();
    });        
</script>
</body>
</html>



用IE打开后,把属标放到ExtJS上面,可以看到显示一个提示框,如下图:
点击在新窗口中浏览此图片

这时,我们可以发现,Ext.QuickTips.init(); 的作用就是把 ext:qtip 的值用于显示提示,作用和前面的例子中的title的作用是一样的。

下面我们改改第二个例子,在<body>后面加上“例子:<br>”,如:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>ExtJS</title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>

<body >例子:<br>
<a href="http://extjs.com" ext:qtip="ExtJS官方网站">ExtJS</a>
<input type="text" ext:qtip="请填写 ..."></input>

<script type="text/javascript" charset="utf-8">
    Ext.onReady(function(){
        Ext.QuickTips.init();
    });        
</script>
</body>
</html>



这时候,在打开后,属标放上去,显示就有错误了,如下图:

点击在新窗口中浏览此图片

这主要是写法不规范造成的,因为那文字内容是直接写在body里了,只要把文件用<p>和</p>把引起来就可以了,如下:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>ExtJS</title>
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<script type="text/javascript" src="ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>

<body ><p>例子:</p><br>
<a href="http://extjs.com" ext:qtip="ExtJS官方网站">ExtJS</a>
<input type="text" ext:qtip="请填写 ..."></input>

<script type="text/javascript" charset="utf-8">
    Ext.onReady(function(){
        Ext.QuickTips.init();
    });        
</script>
</body>
</html>

  • 本文标题: ExtJS Ext.QuickTips.init() 属性说明
  • 文章分类:【JQuery/JavaScript】
  • 非特殊说明,本文版权归【胡同里的砖头】个人博客 所有,转载请注明出处.
留言评论
站点声明:
1、本站【胡同里的砖头】个人博客,借鉴网上一些博客模板,取其各优点模块自行拼装开发,本博客开发纯属个人爱好。
2、所有笔记提供给广大用户交流使用,可转载,可复制,纯个人开发所遇问题锦集记录使用
Copyright © huzlblog.com All Rights Reserved. 备案号:苏ICP备2021056683号-8