jqueryeasyui网站,jquery UI

http://www.itjxue.com  2023-01-20 12:59  来源:未知  点击次数: 

为什么JQuery easyui的网站访问不了了

本来就不会刷新啊。

出现了这种情况,应该是编写者加了选中事件,点击选项卡时做了datagrid的重加载。

你找onselect这个地方,然后将这行注释掉。就没事了

用mshtml解析jquery.easyui开发的网页,无法获取页面元素

("#父窗口元素ID",window.parent.document); 对应javascript版本为window.parent.document.getElementByIdx_x("父窗口元素ID");

取父窗口的元素方法:$(selector, window.parent.document);

那么你取父窗口的父窗口的元素就可以用:$(selector, window.parent.parent.document);

类似的,取其它窗口的方法大同小异

$(selector, window.top.document);

$(selector, window.opener.document);

$(selector, window.top.frames[0].document);

-----------------------------------------------------------------------------

子窗口创建及父窗口与子窗口之间通信:

1、Javascript弹出子窗口

可以通过多种方式实现,下面介绍几种方法

(1) 通过window对象的open()方法,open()方法将会产生一个新的window窗口对象

其用法为:

window.open(URL,windowName,parameters);

URL: 描述要打开的窗口的URL地址,如何为空则不打开任何网页;

windowName:描述被打开的窗口的民称,可以使用'_top'、'_blank'等内建名称,这里的名称跟a href="..." target="..."里的target属性是一样的。

parameters:描述被打开的窗口的参数值,或者说是样貌,其包括窗口的各个属性值,及要传入的参数值。

例如:

打开一个 400 x 100 的干净的窗口:

open('','_blank','width=400,height=100,menubar=no,toolbar=no,

location=no,directories=no,status=no,scrollbars=yes,resizable=yes')

也可以这样写: var newWindow = open('','_blank');

参数说明如下:

top=# 窗口顶部离开屏幕顶部的像素数

left=# 窗口左端离开屏幕左端的像素数

width=# 窗口的宽度

height=# 窗口的高度

menubar=... 窗口有没有菜单,取值yes或no

toolbar=... 窗口有没有工具条,取值yes或no

location=... 窗口有没有地址栏,取值yes或no

directories=... 窗口有没有连接区,取值yes或no

scrollbars=... 窗口有没有滚动条,取值yes或no

status=... 窗口有没有状态栏,取值yes或no

resizable=... 窗口给不给调整大小,取值yes或no

(2) 在javascript中除了通过open()方法建立window对象实现弹出窗口外,还可以通过建立对话框的方式弹出窗口。

如:

alert(""); //弹出信息提示对话框

confirm(""); //弹出信息确认对话框

prompt(""); //具有交互性质的对话框

但是,上述实现的弹出窗口具有的功能较为单一,只能完成较为简单的功能。对于需要在对话框中显示多个数据信息,

甚至是HTML控件就无能为力了。

(3) 使用模态对话框实现复杂的对话框需求

在javascript的内建方法中还有一类方法可以实现通过对话框显示HTML内容,

也就是说可以通过创建对话框的方式来完成创建窗口对象所能完成的功能。

包括创建模态对话框和非模态对话框两种。

实现方法为:

//创建模态你对话框

window.showModalDialog(sURL,vArguments,sFeatures)

//创建非模态对话框

window.showModelessDialog(sURL,vArguments,sFeatures)

其区别在于:

用showModelessDialog()打开窗口时,不必用window.close()去关闭它,当以非模态方式[IE5]打开时, 打开对话框

的窗口仍可以进行其他的操作,即对话框不总是最上面的焦点,当打开它的窗口URL改变时,它自动关闭。而模态[IE4]方式的对话框始终有焦点(焦点不可移走,直到它关闭)。模态对话框和打开它的窗口相联系,因此我们打开另外的窗口时,他们的链接关系依然保存,并且隐藏在活动窗口的下面。 showModeDialog()则不然。

参数说明:

sURL:必选参数,类型:字符串。

用来指定对话框要显示的文档的URL。

vArguments:可选参数,类型:变体。

用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogArguments来取得传递进来的参数。

sFeatures:选参数,类型:字符串。

用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。

dialogHeight:对话框高度

不小于100px,IE4中dialogHeight和dialogWidth 默认的单位是em,而IE5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。

dialogWidth: 对话框宽度。

dialogLeft: 距离桌面左的距离。

dialogTop: 离桌面上的距离。

center: 窗口是否居中

默认yes,但仍可以指定高度和宽度,取值范围{yes | no | 1 | 0 }。

help: 是否显示帮助按钮

默认yes,取值范围 {yes | no | 1 | 0 }。

resizable: 是否可被改变大小。

默认no,取值范围 {yes | no | 1 | 0 } [IE5+]。

status: 是否显示状态栏。

默认为yes[ Modeless]或no[Modal],

取值范围{yes | no | 1 | 0 } [IE5+]。

scroll:指明对话框是否显示滚动条。

默认为yes,取值范围{ yes | no | 1 | 0 | on | off }。

还有几个属性是用在HTA中的,在一般的网页中一般不使用。

dialogHide:在打印或者打印预览时对话框是否隐藏。

默认为no,取值范围{ yes | no | 1 | 0 | on | off }。

edge:指明对话框的边框样式。

默认为raised,取值范围{ sunken | raised }。

unadorned:默认为no,取值范围{ yes | no | 1 | 0 | on | off }。

Jquery的easyui怎么用,有没有强大的教一下!

根据帮助文档,很容易上手

1、jQuery EasyUI 1.3 中文文档

2、jQuery EasyUI 中文API教程

jquery easyui和jquery ui的区别

jquery ui 是jquery开发团队 开发,适用于网站式的页面。

jquery easyui 是第三方基于jquery开发,适用于应用程序式的页面。

两者的方法调用也略有不同:

jquery ui 是:

$("#divTabs").tabs("remove" , index);

jquery easyui 是:

$("#divTabs").tabs("close" , title);

类似的区别还有一些,只有具体使用后才会注意,基本思路差不多。

如何使用jQuery EasyUI打造Web程序

1

在百度搜索引擎中搜索“jQuery EasyUI”关键词,如下图所示。

2

访问JQuery EasyUI中文网,如下图所示。

3

点击导航栏上的【JQuery EasyUI下载】超链接,访问JQuery EasyUI下载页面,如下图所示。

4

选择GPL 版本,点击下方的【官方下载】按钮,如下图所示。

5

解压JQuery EasyUI GPL 版本,工程目录如下图所示。

6

以下用一个Basic CRUD Application(基本增删改查应用程序)为例,来介绍JQuery EasyUI的用法。、

!DOCTYPE html

html

head

meta charset="UTF-8"

titleBasic CRUD Application - jQuery EasyUI CRUD Demo/title

link rel="stylesheet" type="text/css" href=""

link rel="stylesheet" type="text/css" href=""

link rel="stylesheet" type="text/css" href=""

link rel="stylesheet" type="text/css" href=""

script type="text/javascript" src=""/script

script type="text/javascript" src=""/script

/head

body

h2Basic CRUD Application/h2

pClick the buttons on datagrid toolbar to do crud actions./p

table id="dg" title="My Users" class="easyui-datagrid" style="width:700px;height:250px"

url="get_users.php"

toolbar="#toolbar" pagination="true"

rownumbers="true" fitColumns="true" singleSelect="true"

thead

tr

th field="firstname" width="50"First Name/th

th field="lastname" width="50"Last Name/th

th field="phone" width="50"Phone/th

th field="email" width="50"Email/th

/tr

/thead

/table

div id="toolbar"

a href="javascript:void(0)" class="easyui-linkbutton"

iconCls="icon-add" plain="true" onclick="newUser()"New

User/a

a href="javascript:void(0)"

class="easyui-linkbutton" iconCls="icon-edit" plain="true"

onclick="editUser()"Edit User/a

a

href="javascript:void(0)" class="easyui-linkbutton"

iconCls="icon-remove" plain="true" onclick="destroyUser()"Remove

User/a

/div

div id="dlg" class="easyui-dialog" style="width:400px;height:280px;padding:10px 20px"

closed="true" buttons="#dlg-buttons"

div class="ftitle"User Information/div

form id="fm" method="post" novalidate

div class="fitem"

labelFirst Name:/label

input name="firstname" class="easyui-textbox" required="true"

/div

div class="fitem"

labelLast Name:/label

input name="lastname" class="easyui-textbox" required="true"

/div

div class="fitem"

labelPhone:/label

input name="phone" class="easyui-textbox"

/div

div class="fitem"

labelEmail:/label

input name="email" class="easyui-textbox" validType="email"

/div

/form

/div

div id="dlg-buttons"

a href="javascript:void(0)" class="easyui-linkbutton c6"

iconCls="icon-ok" onclick="saveUser()"

style="width:90px"Save/a

a

href="javascript:void(0)" class="easyui-linkbutton"

iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')"

style="width:90px"Cancel/a

/div

script type="text/javascript"

var url;

function newUser(){

$('#dlg').dialog('open').dialog('center').dialog('setTitle','New User');

$('#fm').form('clear');

url = 'save_user.php';

}

function editUser(){

var row = $('#dg').datagrid('getSelected');

if (row){

$('#dlg').dialog('open').dialog('center').dialog('setTitle','Edit User');

$('#fm').form('load',row);

url = 'update_user.php?id='+row.id;

}

}

function saveUser(){

$('#fm').form('submit',{

url: url,

onSubmit: function(){

return $(this).form('validate');

},

success: function(result){

var result = eval('('+result+')');

if (result.errorMsg){

$.messager.show({

title: 'Error',

msg: result.errorMsg

});

} else {

$('#dlg').dialog('close'); // close the dialog

$('#dg').datagrid('reload'); // reload the user data

}

}

});

}

function destroyUser(){

var row = $('#dg').datagrid('getSelected');

if (row){

$.messager.confirm('Confirm','Are you sure you want to destroy this user?',function(r){

if (r){

$.post('destroy_user.php',{id:row.id},function(result){

if (result.success){

$('#dg').datagrid('reload'); // reload the user data

} else {

$.messager.show({ // show error message

title: 'Error',

msg: result.errorMsg

});

}

},'json');

}

});

}

}

/script

style type="text/css"

#fm{

margin:0;

padding:10px 30px;

}

.ftitle{

font-size:14px;

font-weight:bold;

padding:5px 0;

margin-bottom:10px;

border-bottom:1px solid #ccc;

}

.fitem{

margin-bottom:5px;

}

.fitem label{

display:inline-block;

width:80px;

}

.fitem input{

width:160px;

}

/style

/body

/html

7

该案例运行效果,如下图所示。

8

在该案例中,需要引入以下CSS和js文件,如下所示:

link rel="stylesheet" type="text/css" href=""

link rel="stylesheet" type="text/css" href=""

link rel="stylesheet" type="text/css" href=""

link rel="stylesheet" type="text/css" href=""

script type="text/javascript" src=""/script

script type="text/javascript" src=""/script

制作网页中普通的下拉选框中有一个“onchange”事件。 JQuery EasyUI下拉选框中那个事件与其相似???

您好:easyUI等各种UI可以到去官网查询API函数即可。都有详细介绍,每个UI控件有哪些属性,有哪些方法和事件。以及参数如何传递api中都有详细介绍。

easyUI的官网地址:

easyUI的api离线下载地址:

在我的记忆中这个选中事件应该是:onselect()

(责任编辑:IT教学网)

更多

推荐Discuz!建站文章