您好我在我的网络应用程序中使用了很多jQuery元素。我正在使用jQuery UI选项卡,我试图在此选项卡中放入一些show hide元素,但是如果我放入一些自定义jQuery,则此选项卡失败并且页面上的所有其他jQuery都无法执行我想要的默认设置。
例如,我默认隐藏了一个div <div class="partnersiteinfo">
但是默认情况下会显示这个div而必须单击以切换隐藏。
不确定这里出了什么问题,没有很多jquery的经验,所以会感谢一些帮助,我个人认为错误是在JS中,所以我做了一个jsFiddle或查看我的js如下:
JS / js.js
$(document).ready(function () {
$('.partnersiteinfo').hide();
$('.toggle').on('click', function () {
$('.partnersiteinfo').slideToggle();
return false;
});
$(function () {
$('#sortsitemap').on('click', '.toggle', function () {
//Gets all <tr>'s of greater depth
//below element in the table
var findChildren = function (tr) {
var depth = tr.data('depth');
return tr.nextUntil($('tr').filter(function () {
return $(this).data('depth') <= depth;
}));
};
var el = $(this);
var tr = el.closest('tr'); //Get <tr> parent of toggle button
var children = findChildren(tr);
//Remove already collapsed nodes from children so that we don't
//make them visible.
//(Confused? Remove this code and close Item 2, close Item 1
//then open Item 1 again, then you will understand)
var subnodes = children.filter('.expand');
subnodes.each(function () {
var subnode = $(this);
var subnodeChildren = findChildren(subnode);
children = children.not(subnodeChildren);
});
//Change icon and hide/show children
if (tr.hasClass('collapse')) {
tr.removeClass('collapse').addClass('expand');
children.hide();
} else {
tr.removeClass('expand').addClass('collapse');
children.show();
}
return children;
}).find('.toggle').trigger('click');
});
$(function () {
$("#tabs").tabs();
});
});
答案 0 :(得分:1)
不要使用JavaScript隐藏元素。请改用CSS。您也会触发显示click
的{{1}}上的.toggle
,这就是默认情况下可见的原因。
答案 1 :(得分:1)