I’m pretty new to jQuery, and I am converting a page from “regular” javascript to jQuery on a coldfusion page. The page is driven off a stored procedure, which, based on it’s result sets, changes the page and number of input fields. On my page, the input tags look like this.
<cfinput name="#trim(characteristic_id)#_fund" id="#trim(characteristic_id)#_fund" value="#fund#" size="11" onFocus="getCurrentValue(this)" onblur="checkChange(this,'c')">
<cfinput name="#trim(characteristic_id)#_benchmark" id="#trim(characteristic_id)#_benchmark" value="#benchmark#" size="11" onFocus="getCurrentValue(this)" onblur="checkChange(this,'c')">
The onFocus event just saves the current value, and the onBlur event checks to see if the value has changed, and if it has save it in a array for further processing.
Personally, I feel like jQuery is suited very well for this kind of processing, and it is on of the main reason I am trying it.
To my issue. Right now I am replacing the onFocus event handler with:
$("input").focus(function(){
alert($(this).val());
});
simple, but when I try i, nothing happens, no javascript errors, nothing. Nothing happens at all. So, all of the other jQuery code that I have written, I have used $(document).ready..., and when I used that, it worked fine. From what I’ve read, the UI is rendered before the DOM is ready, but to compound that issue the coldfusion is running prior to everything else.
My question is this; Do I have to put all of my jQuery code inside the $(document).ready... function or is there another way around it.
Thanks in advance.
You do need to put your code in
$(document).ready()or$(window).load()if you want to attach handlers to DOM objects. That being said, you can call code in a script block that loads after the element you want to manipulate and that should work, too. However, it is good practice to use the ready/load handlers.If you don’t wait for the DOM to load, the elements don’t exist yet.
You do not have to stuff all of your code in one ready block if you don’t want to. You can have multiple
$(document).ready()blocks. Each will simply be called in succession once the document loads.$(window).load(), by the way, waits for the elements themselves to load, such as images.