ok have variable checking visible divs on page getting length returns 0 why? html structure:
<div class="addnew"> <input type="text"> <input type="text"> <div class="addinput"> <a href="#" class="addnew">add new</a> <div class="div_2"> <h4>lorem ipsum</h4> <div class="div"><img src="" alt=""></div> <p><label for=""></label><input type="text" /></p> <a class="remnew" href="">remove</a> </div> <div class="div_3"> <h4>lorem ipsum</h4> <div class="div"><img src="" alt=""></div> <p><label for=""></label><input type="text" /></p> <a class="remnew" href="">remove</a> </div> </div> </div> this of js:
(function ($) { //check if box has value allready , show if has check1 = function () { var empty1 = $("#widgets-right .div_2 p .title2:input").filter(function () { return this.value == ""; }); if (empty1.length) { $('.div_2').hide(); } else { $('.div_2').show(); }; } check2 = function () { var empty2 = $("#widgets-right .div_3 p .title3:input").filter(function () { return this.value == ""; }); if (empty2.length) { $('.div_3').hide(); } else { $('.div_3').show(); }; } check3 = function () { var empty3 = $("#widgets-right .div_4 p .title4:input").filter(function () { return this.value == ""; }); if (empty3.length) { $('.div_4').hide(); } else { $('.div_4').show(); }; } check4 = function () { var empty4 = $("#widgets-right .div_5 p .title5:input").filter(function () { return this.value == ""; }); if (empty4.length) { $('.div_5').hide(); } else { $('.div_5').show(); }; } check5 = function () { var empty5 = $("#widgets-right .div_6 p .title6:input").filter(function () { return this.value == ""; }); if (empty5.length) { $('.div_6').hide(); } else { $('.div_6').show(); }; } //load on page load $(".area").load("/galleries/ #projects > li a"); $('body').ajaxsuccess(function (evt, request, settings) { check1(); check2(); check3(); check4(); check5(); }); //load on widget title click $(document).on("click", '#widgets-right .widget-top', function () { $(".area").load("/galleries/ #projects > li a"); check1(); check2(); check3(); check4(); check5(); }); // variables var = $('#widgets-right .addinput > div').find(':visible').length + 2; var adddiv = $('.addinput'); //stop default href working $(document).unbind().on("click", '.area a', function () { event.preventdefault(); return; }); //show new forms $(document).on('click', '#widgets-right .addnew', function () { if (i === 10) { alert('thats max!'); } else if (i === 9) { alert('one more go careful gonna break me, pick 1 more image!'); $('.div_' + + '').show('slow'); i++; return false; } else { alert(i); $('.div_' + + '').show('slow'); i++; alert('now pick image'); return false; } }); //remove old forms $(document).on('click', '#widgets-right .remnew', function () { if (i > 1 && jquery(this).parent('div').next().is(':visible')) { alert('remove me in order please.'); } else { i--; $('.title' + i).val(""); $('.link' + i).val(""); $('.img' + i).val(""); $('.gallery_one' + i).attr("src", ''); $(this).parent('div').hide('slow'); } return false; }); //load input boxes $(document).on("click", "#widgets-right .area a", function () { $(this).toggleclass('selected'); if (i <= 2) { alert('added project 1. if want add more projects click button labeled "add new project"!'); var title = $(this).attr('title'); $(".title").val(title); var link = $(this).attr('href'); $(".link").val(link); var img = $("img", this).attr('src'); $(".img").val(img); var imgexample = $("img", this).attr('src'); $(".gallery_one").attr("src", imgexample); } else { i--; alert('added project ' + i); var title = $(this).attr('title'); $('.title' + i).val(title); var link = $(this).attr('href'); $('.link' + i).val(link); var img = $('img', this).attr('src'); $('.img' + i).val(img); var imgexample = $('img', this).attr('src'); $('.gallery_one' + i).attr("src", imgexample); i++; } }); }(jquery)); and variable giving me 0 one:
var = $('#widgets-right .addinput > div').find(':visible').length + 2; now have feeling might because this: #widgets-right .addinput > div selector has default display none on in css, have tried removing css , still no avail.. if strip variable down var = $('#widgets-right .addinput > div').length + 2; returns correct length: have tried following , return 0:
var = $('#widgets-right .addinput > div').filter(':visible').length + 2; and:
var = $('#widgets-right .addinput > div').filter(':visible').find().length + 2; and:
var = $('#widgets-right .addinput > div:visible').find().length + 2; and
var = $('#widgets-right .addinput > div').find(':visible').length + 2; but return 0. why? stripped down version of js requested:
(function ($) { //check if box has value allready , show if has check1 = function () { var empty1 = $("#widgets-right .div_2 p .title2:input").filter(function () { return this.value === ""; }); if (empty1.length) { $('.div_2').hide(); } else { $('.div_2').show(); } }; check2 = function () { var empty2 = $("#widgets-right .div_3 p .title3:input").filter(function () { return this.value === ""; }); if (empty2.length) { $('.div_3').hide(); } else { $('.div_3').show(); } }; //load on page load $(".area").load("http://nettsidemal.no/lundhsas/galleries/ #projects > li a"); $('body').ajaxsuccess(function (evt, request, settings) { check1(); check2(); }); //load on widget title click $(document).on("click", '#widgets-right .widget-top', function () { $(".area").load("http://nettsidemal.no/lundhsas/galleries/ #projects > li a"); check1(); check2(); }); // variables var = $('#widgets-right .addinput > div').find(':visible').length + 2; //show new forms $(document).on('click', '#widgets-right .addnew', function () { if (i === 10) { alert('thats max!'); } else if (i === 9) { alert(i); i++; } else { alert(i); i++; } }); }); }(jquery)); `
ok occuring because variable being set prior document loading , check() functions running.... fix found is: set global variable, , use setinterval make run ever 1500 second checking length of selector so:
setinterval(function() { // every 5 seconds = jquery('#widgets-right').find('.addinput > div:visible').length + 2; }, 1500); this can't best way achive this, please other suggestions make them here.
Comments
Post a Comment