用jquery更改链接的一部分

时间:2015-06-13 16:22:05

标签: javascript jquery ruby-on-rails ajax sorting

我正在使用Ransack进行排序。当搜索和排序仅使用ajax时,我找不到改变排序链接的方法。所以我正在开发自己的解决方案来改变链接和其他一些东西。

到目前为止,我有这个

Ruby

<%= search_form_for @search, :class=>"search",:id=>"search-menio",:remote=>"true", url: advertisements_path, :method => :get do |f| %>
    <div class="sort-link-css"> 
       <%= sort_link(@search, :price,"CENA", {},{ :remote => true, :method => :get }) %>
   </div>
<%end%>

生成此内容:

<div class="sort-link-css">                                     
    <a class="sort_link asc" data-method="get" data-remote="true" href="/lv/advertisements?q%5Bs%5D=price+desc">CENA&nbsp;▲</a>                                             
</div>

我的目标:

当用户点击此链接时,它将更改表示排序顺序的链接类以及也表示排序顺序的链接结尾。

 asc -> desc
 desc -> asc

然后提交搜索表单。

问题: 首次点击我看到一些闪烁和变化,但是当我尝试第二次点击时没有任何反应。

我的剧本:

$('.sort-link-css > a').click(function() {
    var className = $(this).attr('class');
    if (className = "sort link asc") {
        $(this).removeClass('sort link asc');
        this.href = this.href.replace('desc', 'asc');
        $(this).attr('class', 'sort link desc');
    } else if (className = "sort link desc") {
        $(this).removeClass('sort link desc');
        this.href = this.href.replace('asc', 'desc');
        $(this).attr('class', 'sort link asc');
    }
    $('.search').submit();
})

我做错了什么?

3 个答案:

答案 0 :(得分:1)

请尝试使用hasClass()。

https://api.jquery.com/hasclass/

$(this).hasClass( "sort link asc" )

答案 1 :(得分:1)

理想情况下,您可以使用jQuery.hasClassjQuery.is来确定某个元素是否具有指定的类。

您还需要在导航或表单提交之前更新显示。你可以做到这一切:

$('.sort-link-css > a').click(function(e) {
    // cancel the click  event on the link
    e.preventDefault();
    var $this = $(this);
    if ($this.is('.asc')) {
        this.href = this.href.replace('desc', 'asc');
    } else if ($this.is('.desc')) {
        this.href = this.href.replace('asc', 'desc');
    }
    $this.toggleClass('asc desc');
    setTimeout(function() {
        // I am not sure if you want to load the link href
        // or submit the form; use one of the following
        window.location = $this.get(0).href;
        $('.search').submit();
    }, 100);
});

答案 2 :(得分:1)

好的,你的jQuery中有很多错误。你scanf("%i",&iWor); 实际上是两个班而不是三个班。我做了一个小提琴,试着理解它,你会看到你出错的地方:FIDDLE

class="sort_link asc"