Cannot find an element in the window
I use these elements - jQuery window. http://fstoke.me/jquery/window/
I create the window and I have a website created div. This div is hidden. When I open the window the div is visible. This works correctly.
When I click on the picture(#imgChatSend) - I want to get value from input(#txtChatInput). Entry is always empty. Why?
This is my code:
HTML
<div id="ChatForm" style="display:none;">
<input id="txtChatInput"name="txtChatInput" type="text" />
<img id="imgChatSend" src="images/btn-send.png" alt="Send" />
</div>
JS
windowchat = $.window({
title: "Chat",
height: 300,
width: 300,
content: $("#ChatForm").html(),
min开发者_如何转开发Width: 300,
minHeight: 300,
maxWidth: 800,
maxHeight: 800
});
$('#imgChatSend').live('click', function() {
alert($("#txtChatInput").val()); //$("#txtChatInput").val() is ""
return false;
});
It seems the window plugin creates a clone of the content you are showing in the window, resulting in 2 input
s with the id txtChatInput
.
Using $("#txtChatInput")
will refer to the first element found with that specific id (id's are supposed to be unique).
A workaround would be to give your selector a context in which it will start looking for the input:
$('#imgChatSend').live('click', function() {
var $parent = $(this).closest("div"); // get the div the button we just clicked is in
alert($("#txtChatInput", $parent).val()); // tell jquery to only look in this div for the element with id txtChatInput
return false;
});
精彩评论