Question

我在Jquery中有这个功能

function row_content(col1, col2) {
		var divs = col1 + col2;

		for(var n = 0; n < divs.length; n+=2){
			divs.slice(n, n+2).wrapAll('<div class="row-content"></div>');
		}
	}

	var col_2_3 = $('.col_2_3');
	var col_1_3 = $('.col_1_3');

	row_content(col_2_3, col_1_3);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class='col_2_3'>Test</div>
<div class='col_1_3'>Test</div>

<div class='col_2_3'>Test</div>
<div class='col_1_3'>Test</div>

我希望，使用此函数在.row-content中包装两个div，但它不起作用。

感谢您的帮助！

Answer 1

问题是

var divs = col1 + col2;

col1,col2是jQuery对象。上面的行连接输入，不组合选择器。所以length不会按你的意愿工作。

使用jQuery .add()

var divs = col1.add(col2);

http://jsfiddle.net/7w6by7Lz/

Answer 2

$('.col_2_3, .col_1_3').wrapAll("<div class='row-content' />");

演示http://jsfiddle.net/5kcr44pv/

更新：OP忘记提及有多个cols

只要两个类都有相同数量并且它们交替，下面就可以工作。

var cols_2_3 = $('.col_2_3');
var cols_1_3 = $('.col_1_3');

cols_2_3.each(function (index, el) {
    $($(cols_2_3[index]).add(cols_1_3[index])).wrapAll("<div class='row-content' />");
});

DEMO：http://jsfiddle.net/5kcr44pv/1/

Answer 3

var wrapper = $('<div class="row-content"></div>');
$('.col_2_3, .col_1_3').wrapAll(wrapper);

FIDDLE DEMO

包含多个元素的函数Jquery

3 个答案: