在每次单击href的URL之间交替

Alternate between URLs for each onclick of href

本文关键字：URL 之间 href 单击      更新时间：2023-09-26

全部-

我尝试实现的功能如下

我在页面上有一个链接。每次单击链接，href属性都必须更改。例如，链接将以href值开头

<a href="www.google.com">Click Me</a>

对于第二次点击，它应该更改为www.yahoo.com，第三次点击，返回www.google.com，依此类推

 $(".clickMe").bind("click", function(e){
  e.preventDefault();
  var currURL = $(this).attr("href");
  console.log($(this));
  if(currURL === 'www.google.com') {
    $(this).attr("href","www.yahoo.com");
    currURL = "www.yahoo.com";
  } else {
    $(this).attr("href","www.google.com");
    currURL = "www.google.com";
  }
  window.location = currURL;
});

如何在多个用户之间交替使用URL？如果第一个用户点击链接，href应该指向www.google.com，第二个用户应该指向www.yahoo.com等。

我认为处理此问题的最佳方式是在服务器端，而不是在客户端。

您可以执行以下操作：

让所有链接都指向同一个URL/页面

决定第一个用户应该发送到哪里的参数和应用程序变量-

<cflock timeout = "60" scope = "application" type = "Exclusive">
<cfparam name="application.url" default="http://google.com" />
</cflock>

使用获取该URL的逻辑，然后将其更改为下一个请求的新URL-

<cfset myURl = application.url /> 
<cflock timeout = "60" scope = "application" type = "Exclusive">
<cfif myUrl EQ 'http://google./com'>
  <cfset application.url = 'http://yahoo.com' />
<cfelse>
  <cfset application.url = 'http://google.com' />
</cflock>

最后，使用cflocation重定向用户

<cflocation url="#myurl#" addToekn="false" />

如果使用的是ColdFusion 9或更高版本，则可以使用替代运算符而不是if/else。

<cfset application.url = myUrl EQ 'http://google./com' ? 'http://yahoo.com' : 'http://google./com' />

仅使用客户端javascript是无法做到这一点的。您必须对服务器或websocket使用Ajax查询。

这是一个非常轻的样本（这当然不是最好的，但我保持简单，使其易于理解）

客户端（JS，此处有完整的Fiddle：http://jsfiddle.net/DxNxj/1)：

function manageURL(updateServer){
  jQuery.ajax({
    type: 'GET',
    url: 'index.php'
    data: {
        action: (updateServer) ? 'setNextURL' : 'getNextURL'
    }, 
    success: function(data, textStatus, jqXHR) {
        $("#url").html(data);
    },
    error: function(jqXHR, textStatus, errorThrown) {
        console.log("Can't retrieve URL");
    }
  });
}

服务器端（PHP）：

<?php
if(isset($_GET['action']){
    if($_GET['action'] == 'getNextURL'){
        echo getURL();
    else if($_GET['action'] == 'setNextURL'){
        echo getURL(true);
    }
}
function getURL($next = false){
    $url = file_get_contents('url.txt');
    if($next){
        switch($url){
            case "http://google.fr":
                $url = "http://yahoo.com";
                break;
            case "http://yahoo.com":
                $url = "http://google.fr";
                break;
        }
        file_put_contents('url.txt', $url);
    }
    return $url;
}
?>

这在Javascript中是不可能的，因为JS在用户浏览器中运行，并且与其他用户的浏览器没有任何链接。一种选择可以是不直接链接到url，而是将用户重定向到"选择器脚本"（php或其他）。然后做这样的事情（php示例）：

$x = 'google.com';
$y = 'google.com';
$last_url = ''; // get it from a database or file or whatever
if($last_url == $x) {
    $redirect_url = $y;
} else {
    $redirect_url = $x;
}
update_last_url($redirect_url);
header('Location: '. $redirect_url;

演示

(function($) {
    $.fn.clickToggle = function(func1, func2) {
        var funcs = [func1, func2];
        this.data('toggleclicked', 0);
        this.click(function() {
            var data = $(this).data();
            var tc = data.toggleclicked;
            $.proxy(funcs[tc], this)();
            data.toggleclicked = (tc + 1) % 2;
        });
        return this;
    };
}(jQuery));
$('#click_me').clickToggle(function(){
    $(this).attr("href","http://www.google.com");
},function(){
    $(this).attr("href","http://www.yahoo.com");
});

它只能通过ajax来完成，如果用户点击链接，我们必须不断检查每个用户，为每个用户更新链接。

我不知道你是如何识别第二个用户的。

无论如何，我使用的是jquery的toggle函数。

请在这里找到带有示例的更新脚本

感谢

相关文章：