Html弹出窗体提交

Html弹出窗口我试图在提交特定窗体时向客户显示一个花哨的html弹出框/框架（不是windows样式）。不知道什么是最好的做法！Html弹出窗体提交

我尝试了下面的代码，但有2个问题。首先，弹出框看起来像一个我不想要的Windows弹出框（浏览器类型）。我只想要一个简单的方框，我可以添加颜色，图像等。另一个问题是，我的代码中的链接不起作用。例如。我想让其中一个链接在关闭消息框后将我带到网站上的另一个页面，而另一个链接可以简单地用于关闭该框......或者可能只是2个链接，可以将我带到2个不同的页面！

<form action="do.something" method="post" onsubmit="return action_submitted();"> 

<script type="text/javascript"> 

    function action_submitted() { 
     HTML = ''; 
     HTML += '<html><head><title>New Action</title></head>'; 
     HTML += '<body bgcolor="#f5f5f5" style="margin:0px;">'; 
     HTML += 'Congrats, your action was successful! <br/>'; 
     HTML += '<a href="close">Close Message</a><br/>'; 
     HTML += '<a href="/gothere.do">There</a><br/>'; 
     HTML += '<script>onload=function(){setTimeout("self.close()",5000);}<'+'/script>'; 
     HTML += '</body></html>'; 
     var w = 500; 
     var h = 200; 
     var l = (screen.availWidth - w)/2; 
     var t = (screen.availHeight - h)/2; 
     actionwin = open('javascript:opener.HTML','actionwin','left='+l+',top='+t+',width='+w+',height='+h+',status=0'); 

     if (actionwin && !actionwin.closed) actionwin.focus(); 
        return true; 
       } 

</script>

请帮助:)

非常感谢！

来源

2012-04-19 user1343108

这样的弹出式窗口通常称为模式对话框或类似窗口。您可以在Google中找到很多插件。我在http://www.ericmmartin.com/projects/simplemodal/之前使用过这个 – elclanrs 2012-04-19 06:15:38

尝试使用jQuery模态对话框：

var modal = "<div id='modal_pop'>" + 
      "<div><center ><img id='imgLogo' src='../../Images/abc.PNG' alt='Value Interface'/></center></div>" + 
      "<p>This is a fancy modal pop up.</p>" + 
      "</div>";

，并呼吁该site模态对话框

$(modal).dialog({ 
      modal: true, 
      width: 400, 
      height: opts.windowHeight, 
      closeOnEscape: false, 
      draggable: false, 
      resizable: false, 
      zIndex: 99999, 
      bgiframe: true, 
      title: Sample!', 
      buttons: { 
       "OK": function() { 
       // your action on OK clikc 
       $(this).dialog('close'); 
             }, 
       "Cancel": function() { 
        $(this).dialog('close'); 
       } 
      } 
     });

更多信息。

来源

2012-04-19 06:42:28 TRR

我建议你需要在HTML底部创建弹出div。默认情况下隐藏弹出窗口通过CSS，当你想打开它，然后通过javascript显示它，并传递你想要显示的内容，如果你有动态内容。

HTML

<div id="popupWrapper"> 
    <div id="popup"> 
     content goes here 
    </div> 
</div>

CSS

#popupWrapper { display: none;}

jQuery的

$('#button').live('click', function() { 
    $('#popup').text('content goes here'); 
    $('#popupWrapper').fadeIn(); 
});

因为在你的情况你每次点击按钮时重新创建一个poup。这不是一个好办法。

也不要使用任何其他插件，因为它不适合使用第三方插件的简单东西。这会让你的项目变得更加复杂和缓慢。因为他们设计了多种选择的多种情况，并且如果你不需要这个意思，那么使用该插件是值得的。

来源

2012-04-19 07:36:05 Tarun

Html弹出窗体提交

回答

相关问题