Gemeinschaft Lernen Tools-Bibliothek Freizeit

Deutsch

Heim > Web-Frontend > js-Tutorial > 有提示确定与取消功能的弹出式窗的代码_javascript技巧

有提示确定与取消功能的弹出式窗的代码_javascript技巧

WBOY

Freigeben： 2016-05-16 19:15:01

Original

945 Leute haben es durchsucht

我不知道这样的功能叫什么，找了好久也没有找到，所以来找大家帮助了，在此谢谢了。

我的目的是这样的，就是在原有页面基础上，弹出一个新窗，同时原来的页面偏灰色，并且不能操作，必须在弹出的新窗关闭后才能恢复原来窗口的操作。具体效果有点象lightbox和thickbox，我现在是想用thickbox，它可以实现这种旧页面变灰的效果，但是没有办法实现旧页面不能操作的问题。（要在firefox和ie下都能使用，ie的showModalDialog是可以实现这样的目的，但是firefox下不能用啊）

<input type="button" value="关闭？" onclick="back.style.background='#333333';back.style.filter='alpha(opacity=40)';back.style.visibility='';wnd.style.display='inline';">

<script> 
var isDrag = false;

function execCode(){

var newWin = window.open(); 
newWin.document.write(tt.value);

}

var oldX=0,oldY=0;

function init(){ 
    isDrag=true; 
    oldX=event.x; 
    oldY=event.y; 
}

function end(){ 
    isDrag=false; 
}

function moveIt(){ 
    if(isDrag){ 
    var x =window.event.x; 
    var y = window.event.y; 
     
    hdl.parentNode.style.left = parseInt(hdl.parentNode.style.left.replace("px","")) + (x - oldX); 
    hdl.parentNode.style.top = parseInt(hdl.parentNode.style.top.replace("px","")) + (y - oldY); 
     
    oldX = x; 
    oldY = y; 
    } 
}

</script> 
<div id="back" onclick="cancels.click();" onmousemove="moveIt();" onmouseup="end();" style="position:absolute;left:0;top:0;width:1000;height:660;visibility:hidden;"> </div> 
<div id="wnd" onmousedown="init();" onmousemove="moveIt();" onmouseup="end();" style="border:1px outset #333333;position:absolute;filter:alpha(opacity=70);top:100;left:200;width:200;height:120;display:none;"> 
<div id="hdl" style="background:#333377;width:100%;height:20;color:white"><b>窗口</b></div> 
<div style="background:#dddddd;width:100%;height:100">  
<input type="button" value="确定" onclick="opener=null;window.close()"><input type="button" value="取消" id="cancels" onclick="back.style.visibility='hidden';wnd.style.display='none';"> 
</div> 
</div>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

Verwandte Etiketten：

有提示确定与取消功能的弹出式窗的代码

Quelle：php.cn

Vorheriger Artikel：在textarea中显示html页面的javascript代码_表单特效 Nächster Artikel：ie 处理 gif动画的onload 事件的一个 bug_javascript技巧

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Neueste Artikel des Autors

Was ist eine NullPointerException und wie behebe ich sie?

2024-10-22 09:46:29
Vom Anfänger zum Programmierer: Ihre Reise beginnt mit C-Grundlagen

2024-10-13 13:53:41
Webentwicklung mit PHP freischalten: Ein Leitfaden für Anfänger

2024-10-12 12:15:51
C entmystifizieren: Ein klarer und einfacher Weg für neue Programmierer

2024-10-11 22:47:31
Entfalten Sie Ihr Programmierpotenzial: C-Programmierung für absolute Anfänger

2024-10-11 19:36:51
Entfesseln Sie Ihren inneren Programmierer: C für absolute Anfänger

2024-10-11 15:50:41
Automatisieren Sie Ihr Leben mit C: Skripte und Tools für Anfänger

2024-10-11 15:07:41
PHP leicht gemacht: Ihre ersten Schritte in der Webentwicklung

2024-10-11 14:21:21
Erstellen Sie alles mit Python: Ein Leitfaden für Anfänger, um Ihrer Kreativität freien Lauf zu lassen

2024-10-11 12:59:11
Der Schlüssel zum Programmieren: Die Leistungsfähigkeit von Python für Anfänger freischalten

2024-10-11 12:17:31

Aktuelle Ausgaben

function_exists() kann die benutzerdefinierte Funktion nicht ermitteln Funktionstest () {Verwendung der Verwendung durch -Durch -Durch -Durch -Durch -Durch -Durc...

Aus 2024-04-29 11:01:01

0

3

2060

So zeigen Sie die mobile Version von Google Chrome an Hallo Lehrer, wie kann ich Google Chrome in eine mobile Version umwandeln?

Aus 2024-04-23 00:22:19

0

11

2215

Das untergeordnete Fenster bedient das übergeordnete Fenster, aber die Ausgabe antwortet nicht. Die ersten beiden Sätze sind ausführbar, der letzte Satz jedoch nicht.

Aus 2024-04-19 15:37:47

0

1

1870

Im übergeordneten Fenster erfolgt keine Ausgabe document.onclick = function(){ window.opener.document.write('Ich bin die Ausgabe des unter...

Aus 2024-04-18 23:52:34

0

1

1753

Wo gibt es die Kursunterlagen zum CSS-Mindmapping? Kursunterlagen

Aus 2024-04-16 10:10:18

0

0

1779

verwandte Themen

Mehr>

Beliebte Empfehlungen

Beliebte Tutorials

Mehr>

Verwandte Tutorials

Beliebte Empfehlungen

Aktuelle Kurse

Neueste Downloads

Mehr>

Web-Effekte

Quellcode der Website

Website-Materialien

Frontend-Vorlage