使用JS自定义MessageBox

最新推荐文章于 2023-02-18 12:30:40 发布

转载最新推荐文章于 2023-02-18 12:30:40 发布 · 1.6k 阅读

文章标签：

#button #function #input #table #server #javascript

js 同时被 2 个专栏收录

48 篇文章

订阅专栏

html

15 篇文章

订阅专栏

本文介绍了一种使用JavaScript自定义消息提示框的方法，并提供了一个具体的实现示例。该MessageBox可根据不同类型的提示显示不同的图标，还支持拖动位置的功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用JS自定义MessageBox

function MDown(Object){
Obj=Object.id
document.all(Obj).setCapture()
pX=event.x-document.all(Obj).style.pixelLeft;
pY=event.y-document.all(Obj).style.pixelTop;
}

function MMove(){
if(Obj!=''){
document.all(Obj).style.left=event.x-pX;
document.all(Obj).style.top=event.y-pY;
}
}

function MUp(){
if(Obj!=''){
document.all(Obj).releaseCapture();
Obj='';
}
}
function openWithIframe(tit,type,w,h){
var sWidth,sHeight;
sWidth=document.body.clientWidth;
sHeight=document.body.scrollHeight;
var bgObj=document.createElement("div");
bgObj.setAttribute('id','bgDiv');
bgObj.style.position="absolute";
bgObj.style.top="0";
bgObj.style.background="#000000";
bgObj.style.filter="Alpha(Opacity=30);";
bgObj.style.left="0";
bgObj.style.width="100%";
bgObj.style.height="100%";
bgObj.style.zIndex = "10000";
document.body.appendChild(bgObj);

    massage_box.style.left = (document.body.clientWidth - w) / 2;
    massage_box.style.top = (screen.height - h) / 2-80;
    massage_box.style.screenx = (document.body.clientWidth - w) / 2;//仅适用于Netscape
    massage_box.style.screeny = (screen.height - h) / 2-80;//仅适用于Netscape
    massage_box.style.width = w+"px";
    massage_box.style.height = h+"px";
    massage_box.style.display=''
message.innerHTML=tit;
switch(type)
{
   case "warning":
    imgDIV.innerHTML='<img src="../pics/warning.gif" id="img1" />';
    break;
   case "error":
    imgDIV.innerHTML='<img src="../pics/error.gif" id="img1" />';
    break;
   default:
    imgDIV.innerHTML='<img src="../pics/info.gif" id="img1" />';
}
}
function closeWithIframe(input){
obj1=input;
    massage_box.style.display="none";
    document.body.removeChild(document.getElementById("bgDiv"));
}
document.write('<div id="massage_box" style="position:absolute; FILTER: progid:DXImageTransform.Microsoft.DropShadow();z-index:10001;display:none">');
document.write('<div style="border-width:1 1 3 1; width:100%; height:100%; background:#fff; color:#000000;line-height:150%";border-color:#000000; border-width:2px;>');
document.write('<div style="display:inline; width:100%; position:absolute;padding:3px 0 0 5px" id=pop_title></div>');
document.write('<table border="2" cellpadding="0" cellspacing="0" id="table1" style="color:#000000; width:100%; height:100%;border-color:#000000; "><tr align="center" valign="middle"><td>');
document.write('<table border="2" cellpadding="0" cellspacing="0" id="table1" style="width:90%; height:90%;border-collapse:collapse;border:1px solid #C4E2FF;background:#E8FBFF;"><tr><td align="center">');
document.write('<table width="80%"><tr valign="middle" align="center"><td><div id="imgDIV"></div></td><td><div id="message" style="color:#000000;font-size:14px;"></div>');
document.write('</td></tr></table><table width="80%"><tr align="center"><td width="50%"><input type="button" id="btnOK" value="OK" onclick="closeWithIframe(1)" style="width:60px;BORDER-RIGHT: #316293 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #316293 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px;BORDER-LEFT: #316293 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #316293 1px solid; padding-bottom:2px;background-color:#B0CBE6;"/></td><td width="50%"><input type="button" id="btnCancel" value="Cancel" onclick="closeWithIframe(0)" style="width:60px;BORDER-RIGHT: #316293 1px solid; PADDING-RIGHT: 2px; BORDER-TOP: #316293 1px solid; PADDING-LEFT: 2px; FONT-SIZE: 12px;BORDER-LEFT: #316293 1px solid; CURSOR: hand; COLOR: black; PADDING-TOP: 2px; BORDER-BOTTOM: #316293 1px solid; padding-bottom:2px;background-color:#B0CBE6;"/></td></tr></table>');
document.write('</td></tr></table>');
document.write('</td></tr></table>');
document.write('</div>');
document.write('</div>');
        function clickMe()
        {
            openWithIframe('ajax提示框','d',250,150);
        }
    </script>

==============================

另外自己找三张图片用以代替message的图片：warning.gif、error.gif、info.gif

===============================================================

还有另外一种是这种：

function Shop()
{
openWithIframe("已成功添加到购物车！","ShoppingCart.aspx?addItem=ProID",240,110);
}

=================自己定义ShoppingCart.aspx中的内容

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ShoppingCart.aspx.cs" Inherits="Comm_ShoppingCart" %>

<!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 runat="server">
    <title>无标题页</title>
    <script type="text/javascript">
    function LinkLartList()
    {
      window.parent.closeWithIframe()
      window.open('CartList.aspx');

    }
    </script>
</head>

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

using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Collections.Generic;
using System.Text;
using PetShop.Model;
using CHP.ProductPages;
using ChangeHope;
using System.Data.SqlClient;
public partial class Comm_ShoppingCart : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        string itemId = Request.QueryString["addItem"];

          if (Request.Cookies[ProductCMS.GetCookieName()] != null)
          {
              int yx_reuserid = Convert.ToInt32(Request.Cookies[ProductCMS.GetCookieName()].Values["CH_userid"]);
              // Response.Write(Request["yx_user"] + " fggfgfgf " + Request.Cookies[ProductCMS.GetCookieName()].Values["CH_userid"]);
              string sellerid = "";
              YX_sql Exsql = new YX_sql();
              string sql = "select YX_Userid from YX_Product where YX_ID=" + itemId + "";
              SqlDataReader dr3 = Exsql.Re_dr(sql);
              if (dr3.Read())
              {
                  sellerid = dr3["YX_Userid"].ToString();
              }

              if (Convert.ToInt32(sellerid) == yx_reuserid)
              {
                  // ChangeHope_fc.Show_Msg("你不能购买自己的商品！", "ShowProduct.aspx?YX_MID=" + itemId);
                  Response.Write("<script>alert('你不能购买自己的商品！');window.parent.closeWithIframe()</script>");
                  Response.End();
                  Response.End();
              }
              else
              {
                  // string itemId = Request.QueryString["addItem"];
                  Profile.ShoppingCart.Add(itemId);
                  Profile.Save();
                  ShoppingCartControl();
                  //yx_reuserid = Convert.ToInt32(Request.Cookies[ProductCMS.GetCookieName()].Values["CH_userid"]);
                  //yx_reusername = ProductCMS.Decrypt(Request.Cookies[ProductCMS.GetCookieName()].Values["CH_username"]);
              }
          }
          else
          {
              // ChangeHope_fc.Show_Msg("你还没有登陆，请登陆！", "Default.aspx");
              Response.Write("<script>alert('你还没有登录，请登录');window.parent.closeWithIframe()</script>");
              Response.End();
          }

    }
    /// <summary>
    /// 显示商品种类和总价格
    /// </summary>
    public void ShoppingCartControl()
    {
        int count = 0;
        decimal totle = 0;
        //ProfileCommon Profile = new ProfileCommon();
        StringBuilder shtml = new StringBuilder();
        ICollection<CartItemInfo> cart = Profile.ShoppingCart.CartItems;//ShoppingCart.CartItems;
        if (cart.Count > 0)
        {

            shtml.Append("<div id=/"ShopInfo/">");
            foreach (CartItemInfo info in cart)
            {
                count++;
                totle = totle + Convert.ToDecimal(info.Price) * Convert.ToInt32(info.Quantity);
            }
            Label1.Text = count.ToString();
            Label2.Text = totle.ToString();
        }

}
}