如何从单独的页面触发jQuery UI对话框？ [英] How to trigger open a jQuery UI dialog from a separate page?

问题描述

我不太喜欢jQuery，最近我打了个墙。当用户在index.html上触发它时，我将打开一个jQuery UI对话框。它被隐藏在index.html上，直到用户触发它打开。在另一个页面上，这是一个单独的html页面，我有一个按钮，可以将您链接到index.html，但是我需要做的是当用户点击此链接时会将它们带回到index.html并将触发对话框模式窗口自动打开。

我有一定的工作，但我想找到一个替代解决方案，我没有使用URL来使其工作。

回去链接的HTML

  a href =index.html＃dialog>返回< / a> 
  

我的jQuery：

  if（location.href.indexOf（＃dialog）！= -1）{
 
 $（'。dialog-popup'）对话框（open）; 
 
} 
  

UI的jQuery弹出：

  $（.dialog-popup）.dialog（{
 autoOpen：false，
 modal：true，
宽度：860，
显示：{
效果：淡入，
持续时间：500 
}，
隐藏：{
效果： 褪色，
持续时间：500 
} 
}）; 
  

这里的任何帮助将不胜感激。我希望它工作，而不必将#dialog放在URL中。

解决方案

您可以使用 document.referrer 确定用户来自哪里从。如果您解析document.referrer以获取有关用户来自的页面的信息，并将其与某些内容进行匹配，则可以以这种方式触发对话框。

例如，如果你想每当用户从您的域上的页面到达index.html但不是从index.html本身访问该对话框时，您可以运行以下代码：

  jQuery（function（$）{
 
 var referrerDomain = document.referrer.replace（/（http | https）：\ / \ //，''） .split（/）[0]; 
 var myDomain =mydomain.net; //您的域名在这里
 if（referrerDomain == myDomain&！document.referrer。 match（index.html））
 alert（'你从你的域到达这个页面，但不是从index.html！'）
 
}）; 
  

如这个小提琴（全屏版本 here ）

注意 - 小费将显示引荐来源与您目前的同一页面。这不会在普通页面上发生;它只是发生在那里，因为它使用iFrames。

I'm not very good with jQuery and I've hit a wall recently. I have a jQuery UI dialog that opens when a user triggers it on index.html. It is hidden on index.html until the user triggers it open. On another page that's a separate html page, I have a button that links you back to index.html, but what I need to do is when a user clicks on this link it will take them back to index.html and will trigger the dialog modal window to open automatically.

I have it working to some extent, but I wanted to find an alternative solution where I'm not using the URL to make it work.

The HTML of the "go back" link

<a href="index.html#dialog">Go back</a>

My jQuery:

if (location.href.indexOf("#dialog") != -1) {

$('.dialog-popup').dialog("open"); 

}

The jQuery of the UI pop up:

$( ".dialog-popup" ).dialog({
  autoOpen: false,
  modal: true,
  width: 860,
  show: {
    effect: "fade",
    duration: 500
  },
  hide: {
    effect: "fade",
    duration: 500
  }
});

Any help here would be greatly appreciated. I want it to work without having to put the #dialog in the URL.

解决方案

You could use document.referrer to determine where the user came from. If you parse document.referrer for information regarding the page the user came from and match it against something, you could trigger the dialog that way.

For instance, if you want to trigger the dialog whenever a user arrives at index.html from a page that's on your domain, but not from index.html itself, you could run this code:

jQuery(function($){

    var referrerDomain = document.referrer.replace(/(http|https):\/\//,'').split("/")[0];
    var myDomain = "mydomain.net"; //Your domain name goes here
    if( referrerDomain == myDomain && !document.referrer.match("index.html") )
        alert('You arrived at this page from your domain, but not from index.html!')

});

as seen in this fiddle (full screen version here)

Note - the fiddles will show the referrer as the same page you're currently on. This won't happen on a normal page; it's just happening there because it's using iFrames.

这篇关于如何从单独的页面触发jQuery UI对话框？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！