Question

我需要使用jQuery更改网格中元素的顺序。

我有这样的事情：

<div class="products products-grid  ">

<div class="box product">
  <figure>
    <div class="image-table">
      <div class="image-cell">
        <a href="xxx" class="product-image" >
          <img src="xxx" alt="111">
        </a>
      </div>
    </div>
    <figcaption>
      <div class="product-title">
        <a href="xxx" class="title">111</a>
      </div>
      <span class="price">
        <span class="money">xxx</span>
      </span>
    </figcaption>
  </figure>
</div>


<div class="box product">
  <figure>
    <div class="image-table">
      <div class="image-cell">
        <a href="xxx" class="product-image" >
          <img src="xxx" alt="222">
        </a>
      </div>
    </div>
    <figcaption>
      <div class="product-title">
        <a href="xxx" class="title">222</a>

      </div>
      <span class="price">
        <span class="money">xxx</span>
      </span>
    </figcaption>
  </figure>
</div>

<div class="box product">
  <figure>
    <div class="image-table">
      <div class="image-cell">
        <a href="xxx" class="product-image" >
          <img src="xxx" alt="333">
        </a>
      </div>
    </div>
    <figcaption>
      <div class="product-title">
        <a href="xxx" class="title">333</a>

      </div>
      <span class="price">
        <span class="money">xxx</span>
      </span>
    </figcaption>
  </figure>
</div>

我需要在img src中定义的alt中更改＆＃34; products products-grid＆＃34;中元素的顺序。让我们说我有多个盒子产品＆＃34;内部使用alt = 222，我希望它们成为＆＃34;产品中的第一个元素 - 网格＆＃34;。我怎么能用jQuery做到这一点。

Answer 1

您可以使用此jquery插件，它对您执行所需任务非常有用 http://tinysort.sjeiti.com

Answer 2

使用jQuery

可以很容易地做到这一点

$('img[alt="222"]').each(function(){
   $('.products').prepend($(this).closest('.product'));
});

使用多个，使用每个功能（可能）

req.params

此代码未经测试。语法可能有错误。

更改网格视图中元素的顺序

2 个答案: