For some odd reason the part where objects are shown and hidden in my script doesn't seem to be working. I'm not sure if its the fact firefox doesn't like that or whether its the function-based code I have (to save duplicating lines of code)?
There is a working example here and the javascript is here
** Here is the jquery **
$(document).ready(function(){
totUpPrices();
checkBedType();
checkHeadboardOption();
$('.bedtype_price').click(function()
{
checkBedType();
});
$('.headboard_option').click(function()
{
checkHeadboardOption();
});
$('#bed-floater').scrollFollow({ offset:10 });
$('.texture').click(function()
{
$('.texture').removeClass("checked");
$('.texture').children("input").attr("checked","");
$(this).addClass("checked");
$(this).children("input").attr("checked","checked");
});
$('.pricechanger_auto').change(function()
{
totUpPrices();
});
$('.bed-width-single').change(function()
{
if($(this).val()=="2' 6\"" || $(this).val()=="3'")
{
$('.pocketmatic-mattress').attr("disabled","");
}
else
{
$('.pocketmatic-mattress').attr("disabled","disabled");
if($('.pocketmatic-mattress').parent("select").val()=="Pocketmatic")
{
$('.pocketmatic-mattress').parent("select").children("option[value='']").attr("selected","selected");
}
}
});
$('.bed-width-twin').change(function()
{
if($(this).val()=="4' 6\"" || $(this).val()=="6'")
{
$('.pocketmatic-mattress').attr("disabled","");
}
else
{
$('.pocketmatic-mattress').attr("disabled","disabled");
if($('.pocketmatic-mattress').parent("select").val()=="Pocketmatic")
{
$('.pocketmatic-mattress').parent("select").children("option[value='']").attr("selected","selected");
}
}
});
function totUpPrices()
{
var totalprice = 0;
// Check Type of bed prices
var objs = $('.bedtype_price');
$.each(objs, function(index, value) {
if($(value).attr("checked"))
{
totalprice = totalprice + parseInt($(value).attr("cost"));
}
});
// Check Delivery Options
var objs = $('.deliveryoptions_price');
$.each(objs, function(index, value) {
if($(value).attr("checked"))
{
totalprice = totalprice + parseInt($(value).attr("cost"));
}
});
// Check Dropdown Prices
var objs = $('.select_price');
$.each(objs, function(index, value) {
newvalue = $(value).attr("value");
$.each($(value).children("option"), function(i, l){
if($(this).attr("value")==newvalue)
{
totalprice = totalprice + parseInt($(this).attr("cost"));
}
});
});
$('#totalincvat').text(totalprice);
}
function checkBedType()
{
var objs = $('.bedtype_price');
var checkedType = '';
$.each(objs, function(index, value) {
if($(value).attr("checked"))
{
checkedType = $(value).val();
}
});
if(checkedType == "Single Bed")
{
$('.show_with_single').show();
$('.show_with_twin').hide();
$('.changeOnTwin').text("Would you like a headboard?");
}
else
{
$('.show_with_twin').show();
$('.show_with_single').hide();
$('.changeOnTwin').text("Would you like headboards?");
}
}
function checkHeadboardOption()
{
var objs = $('.headboard_option');
var checkedType = '';
$.each(objs, function(index, value) {
if($(value).attr("checked"))
{
checkedType = $(value).val();
}
});
if(checkedType == "Yes")
{
$('.headboard-options').show();
}
else
{
$('.headboard-options').hide();
}
}
});
All help appreciated
Your HTML does not validate. See here,
The very first line of your html is already invalid.
Sorry your first line is ok, I didnt know that was HTML5, though it is pretty early to do HTML5.
我没有关注您的链接(请参阅我对您问题的评论),但是从根本上讲,Firefox在jQuery的show
和hide
或设置display: none
方面没有问题display: none
CSS中display: none
,所以这是一个代码问题。
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.