我有this site,我尝试在jQuery中添加一个名为facebox的联系表单,当我为联系表单添加此代码时,样式中的滑块和样式无法正常工作:
<script type="text/javascript" src="formulario/jquery.js"></script>
我如何解决这个问题,以便联系表格可以正常使用?
问题解释:
网站代码:
<script src="javascripts/home_packaged.js" type="text/javascript"></script>
<link href="stylesheets/home_packaged.css" media="screen" rel="stylesheet" type="text/css" />
<!-- THIS IS MY ORIGINAL LIBRARIES JQUERY CODE -->
<script type="text/javascript" src="javascripts/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="javascripts/jquery.min.js"></script>
<script type="text/javascript" src="javascripts/jquery.selectbox-0.5.js"></script>
<script type="text/javascript" src="javascripts/jquery.colorbox.js"></script>
<!-- DDSlider jQuery Plugin - VERY IMPORTANT -->
<script type="text/javascript" src="javascripts/jquery.DDSlider.min.js"></script>
<!-- Let's start the slider -->
<script type="text/javascript">
//triggers the slider
$(document).ready(function() {
$('#Items1').selectbox();
$('#Items2').selectbox();
$('#Items3').selectbox();
$('#Items4').selectbox();
$('#Items5').selectbox();
$('#Items6').selectbox();
$('#Items7').selectbox();
$('#Items8').selectbox();
$('#Items9').selectbox();
$('#Items10').selectbox();
$(".example5").colorbox();
$('#yourSliderId').DDSlider({
nextSlide: '.slider_arrow_right',
prevSlide: '.slider_arrow_left',
selector: '.slider_selector'
});
});
</script>
<script type="text/javascript">$(document).ready(function(){jQuery.ajaxSetup({'beforeSend':function(xhr){xhr.setRequestHeader("Accept","text/javascript")}})
$("#q").autocomplete({url:'/categories.js',mustMatch:false});$("#q").autocomplete('/categories',function(event,data,formatted){if(data)
document.location.href='/categories/'+data[1];});});</script>
<script type="text/javascript">$(document).ready(function(){$('img.menu_class').click(function(){$('ul.the_menu2').hide();$('ul.the_menu3').hide();$('ul.the_menu').slideToggle('medium');});});$(document).ready(function(){$('a.menu_class').click(function(){$('ul.the_menu2').hide();$('ul.the_menu3').hide();$('ul.the_menu').slideToggle('medium');});});$(document).ready(function(){$('img.menu_class2').click(function(){$('ul.the_menu').hide();$('ul.the_menu3').hide();$('ul.the_menu2').slideToggle('medium');});});$(document).ready(function(){$('img.menu_class3').click(function(){$('ul.the_menu').hide();$('ul.the_menu2').hide();$('ul.the_menu3').slideToggle('medium');});});</script>
<script type="text/javascript">(function($){$.fn.extend({customStyle:function(options){if(!$.browser.msie||($.browser.msie&&$.browser.version>6)){return this.each(function(){var currentSelected=$(this).find(':selected');$(this).after('<span class="customStyleSelectBox"><span class="customStyleSelectBoxInner">'+currentSelected.text()+'</span></span>').css({position:'absolute',opacity:0,fontSize:$(this).next().css('font-size')});var selectBoxSpan=$(this).next();var selectBoxWidth=parseInt($(this).width())-parseInt(selectBoxSpan.css('padding-left'))-parseInt(selectBoxSpan.css('padding-right'));var selectBoxSpanInner=selectBoxSpan.find(':first-child');selectBoxSpan.css({display:'inline-block'});selectBoxSpanInner.css({width:selectBoxWidth,display:'inline-block'});var selectBoxHeight=parseInt(selectBoxSpan.height())+parseInt(selectBoxSpan.css('padding-top'))+parseInt(selectBoxSpan.css('padding-bottom'));$(this).height(selectBoxHeight).change(function(){selectBoxSpanInner.text($(this).find(':selected').text()).parent().addClass('changed');});});}}});})(jQuery);$(function(){$('select.styled').customStyle();});</script>
<script type="text/javascript">jQuery(document).ready(function(){jQuery('#mycarousel').jcarousel();});</script>
<script type="text/javascript">$(document).ready(function(){$('#slider1').s3Slider({timeOut:4000});});</script>
<script type="text/javascript">$(document).ready(function()
{$(".tab_content-n").hide();$("ul.tabs-n li:first").addClass("active").show();$(".tab_content-n:first").show();$("ul.tabs-n li").click(function()
{$("ul.tabs-n li").removeClass("active");$(this).addClass("active");$(".tab_content-n").hide();var activeTab=$(this).find("a").attr("href");$(activeTab).fadeIn();return false;});});</script>
<!-- then I ADD THIS CODE FOR ADD A CONTACT FORM AND THE ERRORS BEGIN -->
<script type="text/javascript" src="formulario/jquery.js"></script>
<script type="text/javascript" src="formulario/jquery.form.js"></script>
<script src="formulario/facebox/facebox.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".contimage").hover(function() {
$(this).animate({
opacity:1
},200);
}, function() {
$(this).animate({
opacity:0.8
},200);
});
$('#submitform').ajaxForm({
target: '#error',
success: function() {
$('#error').fadeIn('slow');
}
});
$('a[rel*=facebox]').facebox()
});
</script>
答案 0 :(得分:0)
在加载jQuery插件之后,看起来你的jquery代码才会被添加。 这样:
<script type="text/javascript" src="formulario/jquery.js"></script>
应该到来之前
<script type="text/javascript" src="javascripts/jquery.DDSlider.min.js"></script>
另外,我建议为每个selectbox元素添加一个类,也许是“selectBoxItems”,然后对该类进行操作。
$('#Items1').selectbox();
$('#Items2').selectbox();
$('#Items3').selectbox();
$('#Items4').selectbox();
$('#Items5').selectbox();
$('#Items6').selectbox();
$('#Items7').selectbox();
$('#Items8').selectbox();
$('#Items9').selectbox();
$('#Items10').selectbox();
$(".example5").colorbox();
$('#yourSliderId').DDSlider({
nextSlide: '.slider_arrow_right',
prevSlide: '.slider_arrow_left',
selector: '.slider_selector'
});
});
这将改为
$(".selectBoxItems").selectbox();
$('#yourSliderId').DDSlider({
nextSlide: '.slider_arrow_right',
prevSlide: '.slider_arrow_left',
selector: '.slider_selector'
});
你能在这里发布特定于问题的代码,包括HTML和JS(最好是格式化的)吗?