JavaScript - Function Not Functioning...
I'm attempting to have the example code section which is currently commented out to keep from code spamming this forum to react with the IF statement created within the FUNCTION that I called "calc".
The code in the example section does work, however the FUNCTION or IF statement is not working. Could anyone help me visualize the problem. Thank you Code: <select name="ship_country" id="ship_country" style="min-width:200px;" onclick="calc;"> <option value="" selected="selected"></option> <option value="United States">United States</option> <option value="Canada">Canada</option> </select> <script type="text/javascript"> function calc() { if (document.getElementById("ship_country").value = ("United States");) { // Example comment representing a lot nonsequential code pertaining to this topic. } } </script> Similar TutorialsHi, I have created a site and on one page it uses 2 divs side by side to display text information. in the left hand div it contains 8 links. these links when clicked load up text stored in separate text files and display it in the right hand div. The code below was working when i ran it from my mac but when i try to load it off the webhost it fails to execute. Code: $(document).ready(function() { $("#mc").click(function() { $("#innertext").load('mc.txt'); }); $("#sd").click(function() { $("#innertext").load('sd.txt'); }); $("#ma").click(function() { $("#innertext").load('ma.txt'); }); $("#rtm").click(function() { $("#innertext").load('rtm.txt'); }); $("#cm").click(function() { $("#innertext").load('cm.txt'); }); $("#r").click(function() { $("#innertext").html('r.txt'); }); $("#bp").click(function() { $("#innertext").load('bp.txt'); }); $("#pc").click(function() { $("#innertext").load('pc.txt'); }); }); Code: <div class="wrapper p2"> <ul class="list1 col-1"> <li>> <a href="javascript:void(0);" onclick="function("mc");" id="mc">Consultancy</a></li> <li>> <a href="javascript:void(0);" onclick="function("sd"); id="sd">Strategy</a></li> <li>> <a href="javascript:void(0);" onclick="function("ma"); id="ma">Market Assessment</a></li> <li>> <a href="javascript:void(0);" onclick="function("rtm"); id="rtm">Routes to Market</a></li> </ul> <ul class="list1 col-2"> <li>> <a href="javascript:void(0);" onclick="function("cm"); id="cm">Change management</a></li> <li>> <a href="javascript:void(0);" onclick="function("r"); id="r">Restructuring</a></li> <li>> <a href="javascript:void(0);" onclick="function("bp"); id="bp">Planning</a></li> <li>> <a href="javascript:void(0);" onclick="function("pc"); id="pc">Project management</a></li> </ul> </div> here is a link to the page on the webhost-- http://herkes.host56.com/index-2.html Any ideas to why this does not work? any help is appreciated I have a form and javascript that doesn't work correctly. I think there's a problem with the javascript, but it's possible the form is the culprit. I'm new at this. Here is the form code for a search boxx: Code: <form id="search" method="get" name="search" action="promotions.html"> <input type="text" size="15" name="ws" maxlength="500" value="pen, keychain, etc." onfocus="this.value='';return false;" /> <button type="submit" value="Search">Go</button> <input type="hidden" name="ID" value="64857723-2161-4778-BDEB-3EE622F6CFF3" /> </form> Here is the javascript that's in the head of /promotions.html: Code: <script type="text/javascript"> function FrameRedirect() { var q = window.location.search; q = (q.length > 1) ? q.substring(1, q.length) : 0; var s = q.substring(0, 2); switch (s) { case 'ws': q = 'http://www.asiconnection.com/ProductSearch/LinkInQS.aspx?'+q; document.getElementById('Content').className = 'active'; break; case 'bn': q = q.substring(3,q.length); document.getElementById('RD2').className = 'active'; break; default: document.getElementById('RD1').className = 'active'; break; } iframe = '<iframe id="frame" src="'+q+'" width="780" scrolling="yes" frameborder="0" height="500"></iframe>'; document.getElementById('Content').innerHTML = iframe; } </script> The search box code is suppose to send the inputted search word to the javascript on /promotions.html page and then load the search results http://www.asiconnection.com/Product.../LinkInQS.aspx into the iframe on that page. The only thing that appears in that iframe is "Oops. Firefox cannot find productsearch" Can someone help me figure this out? Thanks in advance. This <div> layer positioned always at bottom left of the screen on scrolling (and calling some code from labpixies) works well in non-ie browsers, but in ie it requires the omission of the doctype declaration. Why? Is it possible to fix it so that it works with the doctype in ie? Code: <!doctype html> <html lang="en"> <head> <title></title> </head> <body> <div id="master" style="position: absolute; left: -120px; top: 11px; width: 350px; height: 0px"> <div id="menu" style="position: absolute; left: 117px; top: 12px"> <table border="0" width="18" cellspacing="0" cellpadding="0"> <tr> <td width="100%"> <a href="javascript:expand();" onfocus="this.blur()"> <img name="menutop" border="0" src="images/translate.gif" width="23" height="152"></a></td> </tr> </table> </div> <div id="screen" style="position: absolute; left: -138px; top: 12px; "> <table border="0" align="center" cellpadding="0" cellspacing="0" style="margin:0px; padding:0px; border:1px solid #000000;"> <tr> <td style="padding-left:0px; height:0px; line-height:15px; background-color:#000000;"> <a href="http://www.labpixies.com" style="font-family: Arial,Verdana; font-size:12px; font-weight:bold; text-align:left; text-decoration:none; color:#ffffff;"> Gadget by LabPixies.com</a></td> </tr> <tr> <td> <iframe allowtransparency="true" align="top" scrolling="no" width="256" height="135" frameborder="0" src="http://cdn.labpixies.com/campaigns/babylon/babylon.html" target="_self"> </iframe></td> </tr> </table> </div> </div> <script type="text/javascript"> var sidemenu = document.getElementById('master'); function FixY() { screenWidth = screen.width; if (screenWidth == 1024) { var yside = 390; } else if (screenWidth == 1152) { var yside = 400; } else if (screenWidth == 1280) { var yside = 400; } else { var yside = 450; } if(document.body.scrollTop != "undefined") sidemenu.style.top = document.body.scrollTop+yside+'px'; else sidemenu.style.top = window.pageYOffset+yside+'px'; } setInterval("FixY()",100); </script> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </body> </html> I am trying to install a simple slider/carousel in the middle of a web page. I opted for the JCarouselLite plug-in but can't seem to get it working. When the page loads, the images tile vertically(as opposed to line up horizontally) and the nav buttons sit below them. I have included necessary links to jQuery,the Carousel plug-in and also a custom.js file that includes a call to the plug-in to activate it(i think). I also have linked to a custom.css file to style the bar. I am wondering if my call to the plug-in is coded correctly. Beyond that, I can't understand why it isen't working. It is probably obvious but I'm a bit stuck! Could anyone help? I have attached the code showing the html, the custom.js function and the css. Thanks, nevblanc79 HTML: Code: <div id="carousel"> <h3>Our Titles</h3> <div class="carousel"> <ul> <li><a href="portfolio_item.html"><img width="198" height="130" src="img/pictures/1.jpg" alt></a></li> <li><a href="portfolio_item.html"><img src="img/pictures/2.jpg" alt="" width="198" height="130" ></a></li> <li><a href="portfolio_item.html"><img src="img/pictures/3.jpg" alt="" width="198" height="130" ></a></li> <li><a href="portfolio_item.html"><img src="img/pictures/4.jpg" alt="" width="198" height="130" ></a></li> <li><a href="portfolio_item.html"><img src="img/pictures/5.jpg" alt="" width="198" height="130" ></a></li> <li><a href="portfolio_item.html"><img src="img/pictures/6.jpg" alt="" width="198" height="130" ></a></li> </ul> </div> <button class="prev"><</button> <button class="next">></button> </div> Javascript: Code: $(function() { $(".carousel").jCarouselLite({ btnNext: ".next", btnPrev: ".prev" }); }); CSS: Code: #carousel { width:900px; overflow:hidden; margin-bottom:30px; } .carousel ul li { width:198px; margin-right:36px; } #carousel .next, #carousel .prev { margin:0px; font-size:15px; padding:4px 10px; } #carousel .next { float:right; } #carousel .prev { float:left; } The issue I'm having is that the sound for the animation will not go off after the initial operation, every subsequent animation will be silent. Here is the pastebin: Pastebin.com Keep in mind this is not my code and I privately contracted someone out to do this. They are not responding and will not help at this point. I will try to answer any question you may have to the best of my ability. on this site. There are no validation errors. firebug says my linkOut function is not defined... but I have this: Code: function linkOut(link) { var image = link.getElementsByTagName("IMG")[0]; image.src = image.src.replace("H2.png","H.png"); } not sure where to go from here. I have a script that works until I add the clearInterval command, and I am not sure what I have done wrong. The code is: Code: <script type="text/javascript"> function loadChatTalkRefresh(File,ID,Msg){ var xmlhttp; if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { try{ xmlhttp=new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } } xmlhttp.onreadystatechange=function(){ if (xmlhttp.readyState==4 && xmlhttp.status==200){ document.getElementById(ID).innerHTML=xmlhttp.responseText; empress = setInterval(function(){loadChatTalkRefresh(File,ID,Msg)},3000); willow = clearInterval(empress,210000); } } var params=Msg; xmlhttp.open("POST",File,true); xmlhttp.setRequestHeader("Pragma", "Cache-Control:no-cache"); xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xmlhttp.setRequestHeader("Content-length", params.length); xmlhttp.setRequestHeader("Connection", "close"); xmlhttp.send(params); } </script> I have a CMS that was built for our company website that relies on some JS to upload media through a regular browser directly to be displayed on our site. There is a button one clicks to upload video. When clicked the file browser on your computer is supposed to pop-up so you can choose the media you would like to upload. This button no longer is responsive on any of my 12 mac desktops in any common browser nor my mac laptop which is on a different OS X version. Any ideas? Here is the script from the page: [CODE] <script type="text/javascript"> var upload1; window.onload = function() { upload1 = new SWFUpload({ // Backend Settings upload_url: "/08/assets/includes/php/uploadGall.php?id=<?php echo $id; ?>", // Relative to the SWF file (or you can use absolute paths) post_params: { "PHPSESSID" : "<?php echo session_id(); ?>"}, // File Upload Settings file_size_limit : "3102400", // 100MB file_types : "*.*", file_types_description : "All Files", file_upload_limit : "1", file_queue_limit : "1", // Event Handler Settings (all my handlers are in the Handler.js file) file_dialog_start_handler : fileDialogStart, file_queued_handler : fileQueued, file_queue_error_handler : fileQueueError, file_dialog_complete_handler : fileDialogComplete, upload_start_handler : uploadStart, upload_progress_handler : uploadProgress, upload_error_handler : uploadError, upload_success_handler : uploadSuccess, upload_complete_handler : uploadComplete, // Flash Settings flash_url : "/08/assets/includes/js/swfupload/swfupload_f8.swf", // Relative to this file (or you can use absolute paths) swfupload_element_id : "flashUI1", // Setting from graceful degradation plugin degraded_element_id : "degradedUI1", // Setting from graceful degradation plugin custom_settings : { progressTarget : "fsUploadProgress1", cancelButtonId : "btnCancel1" }, // Debug Settings debug: false }); }; var n=new Date().getTime();var c=escape(n*1000+Math.round(Math.random()*1000)); $(document).ready(function() { $('#nav_entry div.sub').each(function(i) { $(this).hide(); }); $('#nav_entry div.title').each(function(i) { $(this).click(function() { $(this).siblings('.sub').slideDown('fast'); $(this).parent().siblings('.ne').children('.sub').slideUp(); }); }); $('img.mover').hide(); <?php if(!$errors) { ?> $("#addEntry").hide(); $("a#nevermind_post").hide(); <?php } else { ?> $("a#add_driver_btn").hide(); <?php } ?> $("a#add_driver_btn").click(function() { $(this).hide(); $("a#nevermind_post").show(); $("#addEntry").slideDown('slow'); }); $("a#nevermind_post").click(function() { $(this).hide(); $("a#add_driver_btn").show(); $("#addEntry").slideUp('slow'); }); }); </script>[CODE] And here is where the button lies in the page: [CODE] <input type="button" value="Upload file (Max 200 MB)" onclick="upload1.selectFiles()" style="font-size: 8pt;" />[CODE] THANKS! Hi, I am facing a problem in passing replace() function as an argument in user defined java function, can any one help me how to resolve it? intention is to pass a file path to my user defined function, but before passing the path i want to replace the character '\' to '\\' I am posting my javascript function he <a href="#" onclick="OpenDocPreview('<%# Eval("PATH")%>'.replace(/\\/g,"\\\\"), '<%# Eval("Filename")%>')"><%# Eval("DocTitle") %></a> function OpenDocPreview(url, docname) { alert('message from search base : ' + url + ' ' + docname); } thank you, I was working on a tutorial for some ajax uploading stuff and I ran across a new function syntax I don't recognize. I am not a Javascript pro, but I am not a newbie either. here is the code I am working on: Code: function handleFileSelect(e){ var files = e.target.files; var output = []; for(var i=0,f;f=files[i];i++){ if(f.type.match('image.*')){ var reader = new FileReader(); reader.onload = (function(theFile){ return function(e){ var span = document.createElement('span'); span.innerHTML = ['<img class="thumb" src="',e.target.result,'" title="',theFile.nbame,'" />'].join(''); document.getElementById('list').insertBefore(span,null); }; })(f); reader.readAsDataURL(f); } } document.getElementById('list').innerHTML = '<ul>'+output.join('')+'</ul>'; } document.getElementById('files').addEventListener('change',handleFileSelect,false); To be a little more clear, the code in question is that is the very middle. The syntax I don't understand is: Code: class.event = (function(arguments){ //stuff you put in a function... })(more Arguments?); I tried to customize a simple one to learn for myself and I wrote this: Code: var a = 'A'; var b = 'B'; test = (function(t){ alert(t); alert(b); })(b); test(a); The browser would alert 'B' and that's it. The console would tell me that 'test is not a function.' OK, so I am confused. The topmost code works. What I am wondering is what the syntax is called for creating a function (or event listener?) that way, and how it works. Although if I new what it was called I could just google how it works. I found this script, and it works great: Code: <script type="text/javascript"> function disable(element) { var input = document.getElementById(element).getElementsByTagName("input"); for(var i = 0; i < input.length; i++) { input[i].setAttribute("disabled","true"); } } </script> I tried to make the inverse by simply reversing the setAttribute() like so: Code: <script type="text/javascript"> function enable(element) { var input = document.getElementById(element).getElementsByTagName("input"); for(var i = 0; i < input.length; i++) { input[i].setAttribute("disabled","false"); } } </script> But that didn't do it. Can someone show me why, and how to fix it? Here's the sample form which I'm trying to test it on: Code: <form> <input type="radio" name="test" onclick="disable('D1')" /> disable<br/> <input type="radio" name="test" onclick="enable('D1')" /> enable<br/> <fieldset id="D1"> <input class="" type="text" value="test value1" /><input class="" type="text" value="test value2" /><br/> <input class="" type="text" value="test value3" /><input class="" type="text" value="test value4" /><br/> <input class="" type="text" value="test value5" /><input class="" type="text" value="test value6" /><br/> </fieldset> </form> Edit: The ultimate goal which I'm working toward now (step by step =) is to have a form more like: Code: <form> <input type="radio" name="test" onclick="disable('D1')" /> <fieldset id="D1"> <input class="" type="text" value="test value1" /><input class="" type="text" value="test value2" /> </fieldset> <input type="radio" name="test" onclick="disable('D2')" /> <fieldset id="D2"> <input class="" type="text" value="test value3" /><input class="" type="text" value="test value4" /> </fieldset> <input type="radio" name="test" onclick="disable('D3')" /> <fieldset id="D3"> <input class="" type="text" value="test value5" /><input class="" type="text" value="test value6" /> </fieldset> </form> And have the fieldsets enable and disable according the selection of the radio buttons. Also, the fieldsets (and their ID's) will be dynamically generated via PHP Thanks-a-bunch, ~ Mo <p> <script type="text/javascript">// <![CDATA[ var metrics = { "mm" : 1, "cm" : 10, "m" : 1000, "inch" : 25.4, "foot" : 304.8 }; function convert(num, dec){ var val = document.getElementById("fromVal").value; if(isNaN(val)){ return } function roundNumber(num, dec) { var result = Math.round( Math.round( num * Math.pow( 10, dec + 1 ) ) / Math.pow( 10, 1 ) ) / Math.pow(10,dec); return result; } document.getElementById("toVal").value = val * metrics[document.getElementById("fromSystem").value]/ metrics[document.getElementById("toSystem").value]; } var interval = null; function watchChanges(){ interval == null ? setInterval("convert()", 500) : clearInterval(interval); } // ]]></script> </p> <table> <tbody> <tr> <td><input id="fromVal" style="width: 100px;" onfocus="watchChanges()" onblur="watchChanges()" type="text" /><select id="fromSystem" onchange="convert()"> <option value="mm">millimeters</option> <option selected="selected" value="cm">centimeters</option> <option value="m">meters</option> <option value="foot">feet</option> <option value="inch">inches</option> </select></td> </tr> <tr> <td colspan="1" align="center">=</td> </tr> <tr> <td><input id="toVal" style="width: 100px;" type="text" disabled="disabled" /><select id="toSystem" onchange="convert()"> <option value="mm">millimeters</option> <option value="cm">centimeters</option> <option value="m">meters</option> <option selected="selected" value="foot">feet</option> <option value="inch">inches</option> </select></td> i keep getting error Call to undefined function codeandurl() below is my code PHP Code: <?php $value= strip_tags(get_field('link',$post)); $resultid=get_field('resultid',$post); codeandurl($resultid,$value); ?> <div id="result"></div> <script type="text/javascript"> function codeandurl(resultid,url){ $( "#result" ).text(resultid); $( "#result" ).dialog({ modal: true, buttons: { Ok: function() { $( this ).dialog( "close" ); } } }); window.open(url); return false; } </script> Hi! I'm trying to toggle a class and one works and the other does not and I don't know why. I'm just getting my feet wet with jquery and javascript and I figured this was a pretty easy task to take on! Maybe. Link to the page: Franklin Township Soccer Club - Change Field Status My sad, sorry attempt =| Code: $( "li.open" ).click(function() { $( this ).toggleClass( "closed" ); }); $( "li.closed" ).click(function() { $( this ).toggleClass( "open" ); }); The first function works with open, so I figured I'd just use opposite on closed! Ha! I don't think so! In the end within those function there is an element in a form on that page it's hidden. I'd like to change the value from a 0 to 1 for vice versa. That' will be my next step. If you could give me a little nudge in the right direction I'd appreciate it! But first understanding why one works and the other does not, that is the primary mission! I do appreciate any help given! Dave Hi All, I'm trying to convert an anonymous function to a real function (nesting is getting out of hand), however the msg object becomes undefined after conversion. Here is the converted anonymous function which fails: https://gist.github.com/2587613 and here is the original anonymous function which works: https://gist.github.com/2587667 Any help would be greatly appriciated I'm trying to "progressively enhance" one of my surveys using javascript. Basically, I have rating scales that make use of radio buttons as each point on the scale. Each radio button occupies its own cell in a table. I wrote some functions that will highlight cells on mouseover in a color corresponding to its position on the scale (e.g. the lowest point is red, the midpoint is yellow, the highest point is green). When a radio button is clicked, the background of the button's cell and preceding cells in the same row will be colored accordingly. The functions are working well in FireFox and Chrome (I just have to add a few lines using the addEvent function to make it compatible with IE). The effect looks a lot nicer when I add a function that makes the visibility of the radio buttons hidden. However, I want to make sure that there is a fallback option in case the functions that color the cells don't work for whatever reason. I would not want the radio buttons hidden in this case. Is there a method whereby I can call the "hideRadiobuttons" function only if the other functions are successfully executed? How can I call a PHP Function inside a Javascript Function? This is what I have so far, but I don't think I'm doing it the right way. Any suggestions? PHP Code: <?php function phpQuery(){ $query = mysql_query("INSERT INTO mytable VALUES('','name','email')"); } ?> <script type="text/javascript"> function delayQueries() { timeoutID = window.setTimeout(doQueries, 2000); } function doQueries() { var runQuery = "<?php phpQuery(); ?>"; } </script> Hi, Any one help me In one variable i have some data ex: var data = document.getElementById("imageId").value; I want to pass this data to another function inside another function ex: var button1 = '<img src="images/Remove-button.gif" width="70" height="15" onclick="removeVerifyImageRow(this),saveLibData('+data+')"/>'; while running the application i am getting an error incase if the data is string ex:if data is 'image1' i am getting an error, but with number there is no problem ex: if data is '1122'. this is very urgent to solve this problem plz any one help me Code: <html> <head> <title>TESTING</title> <script type="text/javascript"> <!-- document.write("<input type='submit' value='submit' onclick='func()'>"); function func() { document.write("<input type='submit' value='New Button' onclick='func()'>"); window.alert("THIS"); } --> </script> </head> <body> <!--input type="button" value="Read" onclick="ReadFiles()"--> </body> </html> This is a very basic version of what I am trying to do. I have a dynamic list which is set in a table. When clicked, a function is run to set up a new list.. The reason I explain that, is that I need to keep it dynamic. Now for the problem: When I run this page, I have the button made right away, then when clicked it creates the new button. The new button should also run the function to create the new button again, but when I click it, I only receive "error on page". I don't know if there is a better way to go about this, but as for this route, I am stuck. Any help is greatly appreciated! -Shane Thank you in advance if someone can help. I have been banging my head against the wall for hours now. Here is the code: Code: for (var i = 0; i < BS_crm['activityTypes'].length; i++) { var clickFunc = function(){ activityList.showForm( -1, {blockType:[""+BS_crm['activityTypes'][i]['id'], "0"]} ); }; var type = { value: BS_crm['activityTypes'][i]['id'], label: "Add New "+BS_crm['activityTypes'][i]['label'], css: BS_crm['activityTypes'][i]['css']+"_16", onClick: clickFunc }; previewLinks.items.push( type ); } Now, basically what I am doing here is running through one array to create an array of objects, that will be used to create links that will use whatever onClick function I pass it. The problem is that on the second line I need the BS_crm['activityTypes'][i]['id'] to be a value, not a reference. If that line was simply changed to: Code: var clickFunc = function(){ activityList.showForm( -1, {blockType:["3", "0"]} ); }; then everything would work as I need. How can I make this happen? I would really appreciate any help. Thank you again in advance. |