Question

我正在使用Colorbox在iframe中加载联系表单。

但是，我希望Colorbox网址与html网址不同，以便为JS和非JS用户提供不同的联系页面。

我确实需要从确切的点击链接中获取url参数。

HTML代码：

<a href="contact?id=XX" class="enquiryForm">

Colorbox代码：

$(document).ready(function(){

$('.enquiryForm').colorbox({height:600, width:800, iframe:true, href: 'colorboxcontact?id=XX'});

});

其中'contact'是非JS页面，'colorboxcontact'是要在Colorbox iframe中加载的页面。

如何从点击的链接中提取url参数，然后将其添加到我的jQuery调用中的'colorboxcontact'href值？

*编辑*

好的我已经到了以下但仍然没有工作。谁能指出我哪里出错？

$('.enquiryForm').colorbox({
    height:600, 
    width:800, 
    iframe:true, 
      href: $('.enquiryForm').each(function() {
        newhref = 'colorboxcontact' + $(this).attr('href').split("?")[3];
        $(this).attr('href', newhref);
    });
  });

Answer 1

要获取url字符串的特定查询字符串信息，您需要在以下位置找到此函数：

How can I get query string values in JavaScript?

略有修改：

function getParameterByName(url, name)
{
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec(url);
  if( results == null )
    return "";
  else
    return decodeURIComponent(results[1].replace(/\+/g, " "));
}

所以你最终会得到这样的东西：

$('.dialog-open').each(function() {
   $(this).colorbox({
     height: 600, 
     width: 800, 
     iframe: true, 
     href: "contact?id=" + getParameterByName($(this).attr("href"), "id")
   });
});

Answer 2

使用.each()获取值，如下所示：

$(document).ready(function(){
  $('.enquiryForm').each(function() {
    $(this).colorbox({
      height: 600, 
      width: 800, 
      iframe: true, 
      href: $(this).attr("href")
    });
  });
});

.each()允许您通过<a>循环访问每个this。如果您不在乎它是否是完全限定的URL，您可以将$(this).attr("href")替换为this.href（IE将完全符合此条件），如下所示：

$(function(){
  $('.enquiryForm').each(function() {
    $(this).colorbox({ height: 600, width: 800, iframe: true, href: this.href });
  });
});

Answer 3

我想也许一个简单的方法是将href设置为返回链接的函数。

$(document).ready(function(){
    $('.enquiryForm').colorbox({
        height:600, 
        width:800, 
        iframe:true, 
        href: function(){
            return $(this).attr('href');
        }
    });
});

jQuery colorbox - 从点击的链接中获取url参数

3 个答案: