同一页面上的多个版本的JQuery无法正常工作

时间:2014-03-24 10:21:01

标签: jquery

实际上我正在为我的asp.net项目寻找clientide复选框控件+可滚动gridview。我收到了来自http://gridviewscroll.aspcity.idv.tw/Demo/Form.aspx#CheckBoxClient的好文章。我已经发布了下面给出的代码,我从上面的网站上找到了代码。这里只有具有可滚动功能的固定标头才能正常工作,但CheckBox客户端无法正常工作。任何人都可以帮助我吗?

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="../Scripts/gridviewScroll.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
gridviewScroll();
});

function gridviewScroll() {
$('#<%=GridView1.ClientID%>').gridviewScroll({
width: 660,
height: 200,
freezesize: 3
});

var cbSelecteds1 = "cbSelecteds1_freezeheader";
var cbSelected1 = "<%=GridView1.ClientID%>_cbSelected1";

CheckBoxCheckAll(cbSelecteds1, cbSelected1);

var cbSelecteds2 = "cbSelecteds2_Copy";
var cbSelected2 = "<%=GridView1.ClientID%>_cbSelected2";

CheckBoxCheckAll(cbSelecteds2, cbSelected2);
}

function CheckBoxCheckAll(checkboxs, checkbox)
{
$('#' + checkboxs).change(function () {
var checked = $(this).is(':checked');
$('input[id*="' + checkbox + '"]').attr('checked', checked);
});

$('input[id*="' + checkbox + '"]').change(function () {
var checked = $(this).is(':checked');
if (!checked) {
$('#' + checkboxs).attr('checked', false);
}
else {
var allchecked = true;
$('input[id*="' + checkbox + '"]').each(function () {
var checked = $(this).is(':checked');
if (!checked) {
allchecked = false;
}
});
$('#' + checkboxs).attr('checked', allchecked);
}
});
}
</script>

3 个答案:

答案 0 :(得分:0)

您正在使用live()方法并链接不推荐使用的大于1.7的库版本。请改用on method

或者,要使live()方法起作用,您需要将jquery库版本链接到1.7以下。


<强>建议:

只使用一个版本的jquery。

答案 1 :(得分:0)

为什么要包含多个jquery?你应该只有一个。它将被加载到全局名称空间。

答案 2 :(得分:0)

通常,您应该只使用一个jQuery版本。我建议使用更高版本。

但是,如果您别无选择,那么您需要查看 jQuery.noConflict()

因此,在您的情况下,您可以对使用版本$的代码保持1.8.3符号。

对于版本1.8.2,您不能使用这样的冲突模式:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"></script>
<script type="text/javascript" src="Scripts/gridviewScroll.min.js" ></script>

<script type="text/javascript"> 
var jQuery_1_8_2 = $.noConflict(true);
jQuery_1_8_2(document).ready(function () { 
gridviewScroll();                     
}); 

function gridviewScroll() { 
jQuery_1_8_2('#<%=GridView1.ClientID%>').gridviewScroll({ 
width: 960, 
height: 200, 
railcolor: "#F0F0F0",
barcolor: "#CDCDCD",
barhovercolor: "#606060",
bgcolor: "#F0F0F0",
freezesize: 3,
arrowsize: 30,
varrowtopimg: "Images/arrowvt.png",
varrowbottomimg: "Images/arrowvb.png",
harrowleftimg: "Images/arrowhl.png",
harrowrightimg: "Images/arrowhr.png",
railsize: 16,
barsize: 8 
});    
}                
</script>