artDialog对话框在PHP下的简单应用-artDialog弹出层篇

本教程使用的是artDialog 4.1.7版本，由于需要iframe的支持，所以选择这个版本，artDialog 5.0.3不支持iframe。

本教程是基于本站站长在网页设计写代码过程中与PHP页面交互的应用，部分表单类功能基于artDialog iframe来完成的。也许这些功能有更好的实现方法，也许站长的水平太低下，所以有不当的地方还请指教。

1、index.php文件内容：

<?php
$text=$_GET['text'];
if ($text=='test')
{
echo 'chenggong';
}
else
{
echo 'shibai';
}
?>

index.html内容：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>artDialog对话框在PHP下的简单应用-artDialog弹出层篇</title>
<style>
body {font-size: 12px;}
</style>
</head>
<body>
<a href="#" onclick="tc()">弹出层示例</a>
</body>
</html>

2、index.html文件主要是让鼠标点击“弹出成示例”，然后交由index.php进行处理，返回结果，AJAX处理判断然后输出弹出层结果。

3、下载artDialog4.1.7.rar，解压后，放置到先在index.html页面中引入

<script src="jiaocheng.js"></script>
<script src="artDialog/artDialog.source.js?skin=default"></script>

4、添加jiaocheng.js文件内容：

function tc() {
$.ajax({
type: 'get',
url: 'index.php?text=test',
contentType: 'text/html;charset=utf-8',
success: function(data, status) {
switch (data) {
case 'chenggong':
art.dialog({
width:'15em',
title: '友情提示!',
time: 2,
content: '成功!'
});
CheckLogin();
break;
default:
art.dialog({
width:'15em',
title: '友情提示!',
time: 2,
content: '失败！'
});
}
return false;
}
});
return false;
}

然后赶快试试吧。

注意，本教程需在PHP环境中调试。也可下载下边的本教程演示。

演示文件下载：http://www.sitejs.cn/download/201304/file/16570-test.rar

artDialog4.1.7下载地址：http://www.sitejs.cn/sitejs-16571-1.html

更多PHP教程请访问JS代码站

转载于:https://blog.51cto.com/3285518/1192222

artDialog对话框在PHP下的简单应用-artDialog弹出层篇相关推荐

一个简单的遮罩弹出层效果
为什么80%的码农都做不了架构师?>>> 打酱油的日子就是要多学习下,最近在学写JS类库,虽然有面对对象语言的基础,但是感觉入手前端还是压力很大,就JS来说,干了半年了,水准还 ...
html正方形对话框素材,10种展示效果的弹出层对话框插件method.js
一款10种展示效果的弹出层对话框插件method.js,可以点击演示页面的10个按钮分别查看不同的弹窗效果,基本上该有的弹窗特效都有了,喜欢的童鞋请收下吧. 查看演示下载资源: 68 次下载资源 ...
【position也可以很复杂】当弹出层遇上了鼠标定位（下）
前言接着昨天的内容写,为了保证内容连续性,这里还是把昨天的内容拷了过来. 请用现代浏览器测试引出问题有图有真相,我们来看一个智联招聘里面经常出现的图层: 他这个是没有什么问题的,我们来简单看看其 ...
下拉选择框、弹出框、滚动条操作
目标 1. 掌握下拉选择框的操作方法 2. 掌握处理弹出框的方法 3. 掌握调用JavaScript方法 1. 下拉选择框操作说明:下拉框就是HTML中<select>元素: 1.1 如 ...
利用JS弹出层实现简单的动态提示“正在加载中，请稍等...
最近项目中大量用到了JQuery中的Ajax异步加载数据,数据量非常大,导致每次加载的时候都感觉到非常非常慢,让客户体验非常不好,就想到用JS做一个简单的提示. JQuery版本:1.7.1: 编写一 ...
Android TextView局部下划线及点击弹出popu
最近在项目中遇到一个需求,产品要求实现一个可以部分点击的 TextView,可点击的部分需要有虚线下划线以及在点击区域弹出 Popupwindow,这里把我的实现过程记录下来. 文章目录实现思路 L ...
分享一个灰常简单好用的jQuery弹出层插件:jquery.artwl.thickbox.js
最终效果: 插件原理所有弹出层的原理都差不多,就是用一个全屏半透明DIV做遮罩层,在这个遮罩层上再显示出一个层放要显示的内容,其他的就是CSS的运用了. 本插件为了使用简单,把JS跟CSS封装在了一 ...
自写jQuery插件，实现简单网页遮罩层/弹出层功能，兼容IE6、IE7
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/u010480479/article/details/25159287 本屌丝近期工作要求重写站点全部 ...
QQ截屏抓级联菜单、下拉菜单及右键弹出菜单图
QQ方便的截屏功能大家都已经玩过了,又给聊天增添了不少乐趣.只要在浏览网页时发现什么值得共享的东东,单击捕捉屏幕按钮即可搞定.这对那些被QQ尾巴整怕了,看到链接就会浑身发抖的人来说,可以长舒一口气了. ...

artDialog对话框在PHP下的简单应用-artDialog弹出层篇

artDialog对话框在PHP下的简单应用-artDialog弹出层篇相关推荐

最新文章

热门文章