简介：本范例是用JQuery实现了一系列的对话框来替代浏览器自己的对话框，包含Alert，Confirm，Prompt对话框，本对话框有如下特点： 1、用户可以自定义对话框的界面 2、可以自定义对话框的标题本提示框使用标准的模式窗口弹出，改变浏览器的大小，窗口位置也会随之改变，可以点击标题拖动对话框
代码使用方法：
在网页<head>区添加以下代码
Select All
<style type="text/css">
BODY,
HTML {
padding: 0px;
margin: 0px;
}
BODY {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
background: #FFF;
padding: 15px;
}
H1 {
font-size: 20px;
font-weight: normal;
}
H2 {
font-size: 16px;
font-weight: normal;
}
FIELDSET {
border: solid 1px #CCC;
-moz-border-radius: 16px;
-webkit-border-radius: 16px;
border-radius: 16px;
padding: 1em 2em;
margin: 1em 0em;
}
LEGEND {
color: #666;
font-size: 16px;
padding: 0em .5em;
}
PRE {
font-family: "Courier New", monospace;
font-size: 11px;
color: #666;
background: #F8F8F8;
padding: 1em;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
}
/* Custom dialog styles */
#popup_container.style_1 {
font-family: Georgia, serif;
color: #A4C6E2;
background: #005294;
border-color: #113F66;
}
#popup_container.style_1 #popup_title {
color: #FFF;
font-weight: normal;
text-align: left;
background: #76A5CC;
border: solid 1px #005294;
padding-left: 1em;
}
#popup_container.style_1 #popup_content {
background: none;
}
#popup_container.style_1 #popup_message {
padding-left: 0em;
}
#popup_container.style_1 INPUT[type='button'] {
border: outset 2px #76A5CC;
color: #A4C6E2;
background: #3778AE;
}
</style>
<!-- Dependencies -->
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.ui.draggable.js" type="text/javascript"></script>
<!-- Core files -->
<script src="jquery.alerts.js" type="text/javascript"></script>
<link href="jquery.alerts.css" rel="stylesheet" type="text/css" media="screen" />
<!-- Example script -->
<script type="text/javascript">
$(document).ready( function() {
$("#alert_button").click( function() {
jAlert('This is a custom alert box', 'Alert Dialog');
});
$("#confirm_button").click( function() {
jConfirm('Can you confirm this?', 'Confirmation Dialog', function(r) {
jAlert('Confirmed: ' + r, 'Confirmation Results');
});
});
$("#prompt_button").click( function() {
jPrompt('Type something:', 'Prefilled value', 'Prompt Dialog', function(r) {
if( r ) alert('You entered ' + r);
});
});
$("#alert_button_with_html").click( function() {
jAlert('You can use HTML, such as <strong>bold</strong>, <em>italics</em>, and <u>underline</u>!');
});
$(".alert_style_example").click( function() {
$.alerts.dialogClass = $(this).attr('id'); // set custom style class
jAlert('This is the custom class called “style_1”', 'Custom Styles', function() {
$.alerts.dialogClass = null; // reset to default
});
});
});
</script>
调用方法
jAlert(message, [title, callback])
jConfirm(message, [title, callback])
jPrompt(message, [value, title, callback])
和标准的提示对话框不一样，本插件的提示信息可以包含HTML代码，也就是说你可以使用<Br>标签换行等等
本函数不能返回值，要想获得返回值必须通过回调函数，把函数名放在callback的位置即可
详细用户可以参考Demo
分享到：
相关推荐
在网页开发中，"JQuery alert confirm prompt 修改版"通常指的是开发者对原生JavaScript中的alert、confirm和prompt函数进行了自定义或者增强，以提供更美观、功能更丰富的对话框体验。 原生JavaScript的alert、...
"jQuery插件：警告-确认-提示弹出对话框效果"是一个针对jQuery的扩展，它允许开发者轻松地实现警告、确认和提示功能，而无需依赖浏览器内置的alert、confirm和prompt对话框。这个插件极大地增强了这些基本对话框的...
本资源“JQuery Alert、confirm、prompt提示框插件.zip”提供了一种增强原生JavaScript alert、confirm和prompt对话框的方式，使得开发者能够自定义这些提示框的样式和功能，以更美观和用户友好的方式向用户展示信息...
本项目“jQuery模拟alert confirm prompt等”是利用jQuery的功能来创建自定义的提示对话框，以替代浏览器默认的alert、confirm和prompt功能。这种方法在需要自定义样式、增加交互性或保持界面一致性时特别有用。 ...
《jQuery Alert, Confirm, Prompt 实现详解》 在网页开发中，我们经常需要与用户进行交互，例如显示警告信息、确认操作或者获取用户输入。原生JavaScript提供了alert(), confirm(), prompt()函数，但它们的样式固定...
总之，jQuery提供的灵活性和强大的DOM操作能力使开发者能够超越浏览器内置的`alert`、`confirm`和`prompt`，创建更美观、功能更全面的对话框。这不仅提升了用户体验，也增加了网页的交互性和专业性。通过实践和学习`...
内容索引:脚本资源,jQuery,提示框,jQuery插件,Confirm jQuery Alert Dialogs，又一个基于jQuery的提示框插件，主要包括Alert、Confirm、prompt这三种，还有一个高级范例，可以在提示框内嵌入HTML语言，可以自定义...
这个Jquery插件的目的是替代JavaScript的标准函数alert()，confirm（），和 prompt（）。这个插件有 如下这些特点： 1：这个插件可以使你可以支持你自己的css制定。使你的网站看起来更专业。 2：允许...
而"JQuery Alert 弹出框美化(Alert, Confirm, & Prompt Replacements)"是针对浏览器原生的alert、confirm和prompt对话框的一种美化和功能增强方案，旨在提升用户体验并提供更丰富的交互。 原生的JavaScript alert、...
jQueryAlert是一种基于jQuery库的插件，用于创建更美观、功能丰富的提示对话框，它可以替代JavaScript内置的alert、confirm和prompt函数。这个插件的主要目的是为用户提供一个自定义且交互性强的对话框解决方案，使...
`jQuery Alert` 是一个便捷的提示对话框插件，它扩展了原始JavaScript的`alert()`、`confirm()`和`prompt()`功能，为开发者提供了更丰富的用户交互体验。该插件基于强大的jQuery库构建，旨在为网页应用添加美观且可...
在JavaScript编程中，`alert`、`confirm`和`prompt`是三种常见的用户交互方法，它们用于在浏览器环境中向用户显示信息、获取用户输入或进行确认操作。下面将详细介绍这三种函数及其自定义实现。 `alert`函数是...
总的来说，`jquery-confirm`是一个功能强大的jQuery对话框插件，通过它的丰富特性和易用性，可以帮助开发者快速构建交互式的网页应用。无论是简单的确认操作，还是复杂的异步处理，`jquery-confirm`都能轻松应对，...
"Jquery样式化Alert"是指利用jQuery扩展默认浏览器的alert、confirm和prompt对话框，以提供更加美观和定制化的用户体验。这些基本的对话框在原生JavaScript中功能简单且样式单一，而通过jQuery，我们可以创建具有...
jQuery Confirm插件是基于jQuery库的，它为开发者提供了一种自定义的确认对话框解决方案，可以替代浏览器原生的confirm函数。该插件不仅兼容Internet Explorer（IE）和Firefox等主流浏览器，还支持最新的Web标准，...
一个良好的自定义对话框插件应该具有一定的可配置性，允许用户设置对话框的标题、内容、按钮文本、大小等属性。 7. **兼容性和性能优化**： 考虑到不同的浏览器可能有不同的渲染方式，源码可能包含了对各种浏览器...
SweetAlert2是一款基于jQuery的模态消息对话框插件，专为增强网页中的提示和确认对话框体验而设计。它摒弃了浏览器默认单调的alert、confirm和prompt对话框，转而提供了一种更加现代、美观且功能丰富的交互方式。这...
jQueryAlert插件是一种基于jQuery库的弹窗对话框解决方案，它为网页开发人员提供了一种简单而优雅的方式来显示警告、确认或自定义消息。这个插件扩展了原生的JavaScript alert()、confirm()和prompt()函数，使得...