I'm beginner in JQuery, how could I select an object using JQuery ?

This is the code:

<script type="text/javascript" language="javascript">

function Hide(senderID) {
   $("#" + senderID).hide(200);
   // this exception is thrown // Microsoft JScript runtime error: Object expected
}

</script>

<div id="div1" onclick="javascript:Hide(this.id)" 

Any help!

I'm beginner in JQuery, how could I select an object using JQuery ?

This is the code:

<script type="text/javascript" language="javascript">

function Hide(senderID) {
   $("#" + senderID).hide(200);
   // this exception is thrown // Microsoft JScript runtime error: Object expected
}

</script>

<div id="div1" onclick="javascript:Hide(this.id)" 

Any help!

• javascript
• jquery
• asp

• You're doing it correctly. What is the problem? (apart from your post missing closing DIV tag, script tag etc.) – Zabba Commented Mar 17, 2011 at 8:02
• can you add the line alert(typeof $ + ' -- ' + typeof jQuery); inside the Hide function at the beginning and post its oute? – Salman Arshad Commented Mar 17, 2011 at 8:07
• #Salman A: the message is: undefineddiv1undefined. seems there's a problem in the access to the JQuery files. – Homam Commented Mar 17, 2011 at 8:15

5 Answers 5

• Don't:
  1. get an id from an element
  2. pass that id to a function
  3. use the id to get the element.
• Do: Just pass the element.
• Don't stick javascript: at the front of an intrinsic event attribute, it doesn't mean what you think it means.
• Don't use intrinsic event attributes for that matter (although I didn't fix this in this example). Use unobtrusive JS.
• Avoid triggering events based on clicks on a div. This can't be targeted with a focus based navigation device (such as using the tab key on the keyboard and numerous devices used by people with disabilities) without using new features introduced in HTML 5 that don't see widespread support yet. Use an element that is designed as an interaction control (such as a button). (Also not fixed in the example below)

Example:

function Hide(sender) {
       $(sender).hide(200);
}

<div id="div1" onclick="Hide(this)" 

Code is exactly the same as yours, I added the correct tags, and the call to include the jquery library:

<script type="text/javascript" src="http://ajax.googleapis./ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script>
function Hide(senderID) {
     $("#" + senderID).hide();
}
</script>
<div id="div1" onclick="javascript:Hide(this.id)">Click Me</div>

function Hide(sender) {
   $(sender).hide(200);
}
<div id="div1" onclick="javascript:Hide(this)"></div>

hope it helps

I can't resist. Why not use jQuery's full power?

HTML:

<div class="hideable-div">Click me and get rid of me.</div>

jQuery:

$('.hideable-div').click(function () {
    $(this).hide(200);
});

you misplaced those "" in

<div id="div1" class=""hideable-div>Click me and get rid of me.</div>

Should be like

<div id="div1" class="hideable-div">Click me and get rid of me.</div>