jQuery单击类加载链接答案

【问题标题】：jQuery click Class load a linkjQuery单击类加载链接
【发布时间】：2014-08-09 13:37:28
【问题描述】：

我在 wordpress 中安装了一个脚本，可以将选定的视频添加到收藏夹。代码是这样的：当用户点击一个按钮时，脚本会发送一个类似“？wpfpaction=add&postid=147”的请求，我有这样的视频ID

<div class="wrap-box-video" id="424">
   <div class="button_fav">
     <a href="?wpfpaction=add&postid=424" rel=nofollow"><img src="blabla" /></a>
   </div>
</div>

可以制作一个 jQuery，而不是“button_fav”，假设我有“addfav”和“removefav”（如果视频没有添加到收藏夹或“removefav”，我必须编写代码来回显“addfav” " 如果视频存在于收藏夹中) 当用户单击具有 "addfav"/"removefav" 类的 div 时，jQuery 从 class="wrap-box-video" 中提取 id 并发送 href "?wpfpaction=add&postid=424" ?

我设法使它与这段代码一起工作：

$(document).ready(function(){ $("div.addfav").click(function(e){ e.preventDefault(); alert(window.location.href.split('?')[0] + "?wpfpaction=add&postid=" + $(this).parents(".wrap-box-video").attr("id")); }); }

我现在的问题是，如何使它工作，因为这只会给我一个警报，如果我删除“alert()”不起作用，我希望它加载而不显示在 url 中（不显示 ? wpfaction.... 在 url 之后）

【问题讨论】：

先关闭你的a！ :D

标签： javascript jquery

【解决方案1】：

所以最终的 HTML 将是这样的：

<div class="wrap-box-video" id="424">
   <div class="addfav">
       <a href="?wpfpaction=add&postid=424" rel="nofollow"><img src="blabla" alt="add" /></a>
   </div>
</div>
<div class="wrap-box-video" id="425">
   <div class="removefav">
     <a href="?wpfpaction=add&postid=424" rel="nofollow"><img src="blabla" alt="remove" /></a>
   </div>
</div>

用于创建动态 URL 的 jQuery ：

$(document).ready(function(){
    $("div.wrap-box-video a").click(function(e){
        e.preventDefault();
        if($(this).parent().hasClass('addfav'))
        {
            alert(window.location.href.split('?')[0] + "?wpfpaction=add&postid=" + $(this).parents('div.wrap-box-video').first().attr("id"));
        }
        else
        {
            alert(window.location.href.split('?')[0] + "?wpfpaction=remove&postid=" + $(this).parents('div.wrap-box-video').first().attr("id"));
        }
    });
});

假定您的删除 URL 为“wpfpaction=remove&postid=424”

JS FIDDLE

【讨论】：

$(document).ready(function(){ $("div.addfav").click(function(e){ e.preventDefault(); alert(window.location.href.split('?')[0] + "?wpfpaction=add&postid=" + $(this).parents(".wrap-box-video").attr("id")); }); } 这很好用，它显示警报.. 但我怎样才能让它加载到 url 中？让它工作......
嘿@user3469760，用这个代替警报：document.location.href = window.location.href.split('?')[0] + "?wpfpaction=add&postid=" + $(this).parents('div.wrap-box-video').first().attr("id");更新JS Fiddle

【解决方案2】：

是的。给定

<div class="wrap-box-video" id="424">
   <div class="button_fav">
     <a href="?wpfpaction=add&postid=424" rel=nofollow"><img src="blabla" /></a>
   </div>
</div>

使用 jQuery，您的代码将类似于：

$(".button_fav").on('click', function() {
  var id = $(this).closest('.wrap-box-video')[0].id;
  window.location = "?wpfpaction=add&postid="+id;
});

【讨论】：

【解决方案3】：

您可以通过多种方式做到这一点，但最简单的方法可能是使用 HTML 数据元素（即 data-id="yourIdNumber" 然后在您的点击事件中添加类似的内容 - $(this).closest('.wrap-box-video').data('id');

【讨论】：

【解决方案4】：

这可能有效；

$('.button_fav').click(
    function(){
        var myHref = $(this).children("a").attr('href');
         var videoId = $(this).parents(".wrap-box-video").attr("id");
    }
);

【讨论】：