Jquery实现Div上下移动示例

前端技术 2023/09/07 JavaScript
复制代码 代码如下:

$(this).ready(function() {
$(\".up\").each(function() {
$(this).click(function() {
var $tr = $(this).parents(\"li\");
if ($tr.index() != 0) {
$tr.prev().before($tr);
}
});
});
var trLength = $(\".down\").length;
$(\".down\").each(function() {
$(this).click(function() {
var $tr = $(this).parents(\"li\");
if ($tr.index() != trLength) {
$tr.next().after($tr);
}
});
});
$(\"a[name=\'up\']\").click(function() {
if ($(\"input[name=\'rule\']:checked\").size() > 1) {
alert(\"只能选择一项进行上下移操作!\");
return;
}
$(\"input[name=\'rule\']:checked\").each(function() {
var $div = $(\'#rule_\' + $(this).val());
if ($div.index() != 0) {
$div.prev().before($div);
}
});
});
$(\"a[name=\'down\']\").click(function() {
if ($(\"input[name=\'rule\']:checked\").size() > 1) {
alert(\"只能选择一项进行上下移操作!\");
return;
}
$(\"input[name=\'rule\']:checked\").each(function() {
var $div = $(\'#rule_\' + $(this).val());
if ($(\'#rule_\' + (parseInt($(this).val()) + 1)).html() != null) {
$div.next().after($div);
}
});
});
});

本文地址:https://www.stayed.cn/item/18945

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见,何事秋风悲画扇。