0
이것은 현재 제작중인 의상 콘테스트 애플리케이션을위한 코드입니다. 모두 개별적으로 클릭 할 수있는 라벨로 둘러싸인 라디오 버튼 1-10 행이 있습니다. 클릭 이벤트가 발생하면 양식이 제출되고, 일부 후 처리가 수행되어 json 객체가 반환됩니다. 여기에서 게시물 데이터를 페이지에 삽입합니다. 이 과정은 컨테스트의 모든 의상에 투표 할 때까지 계속됩니다.Internet Explorer에서이 jQuery 코드가 마음에 들지 않습니다. (Livequery 플러그인)
Firefox, Safari, Camino는 모두 의도 한대로 작동합니다. 모든 IE의 컨테이너가 뒤집 힙니다. form.parents ("# container"); (예 : 컨테이너에 대한 다른 참조도 실패합니다.)
다음 변수 (예 : form [0] .id)는 예상대로 costume_rating_form을 표시합니다. . jquery 개체를 사용하여 #container 요소를 찾을 수 없을 때 확신 할 수 없습니다.
IE 브라우저에서 livequery가 click 이벤트에 제대로 바인딩되지 않은 것으로 의심됩니다. 이 문제를 어떻게 해결할 수 있습니까?
$("form#costume_rating_form input[type=radio]").livequery("click",function(){
form = $(this).parents("form:first");
container = form.parents("#container");
vote_eid = form.find("input#vote_eid");
contest_results = container.find("#contest_results");
contest_image = container.find(".contest_image:first");
contest_next = container.find("#side_bar #next_up");
contest_content = contest_image.next();
.....
<div class="full center" id="container">
<div class="s1-2" id="main">
<div class="s_w clearfix">
<div id="costume_rating">
<h3 class="middle">
Rate This Costume
</h3>
<form action="/costume-rate/" method="post" id="costume_rating_form" name="costume_rating_form">
<label style="display: none;" for="costume_rating" class="error contest_selector">Please select a rating.</label>
<div id="rating_scores">
<!-- <div class="rate_tab radius_t_5">Rate This Costume</div> -->
<div class="thumb_down">
:-/
</div>
<div class="middle">
<label for="r1" class="contest_selector"><input type="radio" value="1" name="costume_rating" id="r1" class="radio" style="position: absolute; top: 0pt; right: 99999px;">1</label> <label for="r2" class="contest_selector"><input type="radio" value="2" name="costume_rating" id="r2" class="radio" style="position: absolute; top: 0pt; right: 99999px;">2</label> <label for="r3" class="contest_selector"><input type="radio" value="3" name="costume_rating" id="r3" class="radio" style="position: absolute; top: 0pt; right: 99999px;">3</label> <label for="r4" class="contest_selector"><input type="radio" value="4" name="costume_rating" id="r4" class="radio" style="position: absolute; top: 0pt; right: 99999px;">4</label> <label for="r5" class="contest_selector"><input type="radio" value="5" name="costume_rating" id="r5" class="radio" style="position: absolute; top: 0pt; right: 99999px;">5</label> <label for="r6" class="contest_selector"><input type="radio" value="6" name="costume_rating" id="r6" class="radio" style="position: absolute; top: 0pt; right: 99999px;">6</label> <label for="r7" class="contest_selector"><input type="radio" value="7" name="costume_rating" id="r7" class="radio" style="position: absolute; top: 0pt; right: 99999px;">7</label> <label for="r8" class="contest_selector"><input type="radio" value="8" name="costume_rating" id="r8" class="radio" style="position: absolute; top: 0pt; right: 99999px;">8</label> <label for="r9" class="contest_selector"><input type="radio" value="9" name="costume_rating" id="r9" class="radio" style="position: absolute; top: 0pt; right: 99999px;">9</label> <label for="r10" class="contest_selector"><input type="radio" value="10" name="costume_rating" id="r10" class="radio" style="position: absolute; top: 0pt; right: 99999px;">10</label> <input type="submit" value="Vote" name="submit" id="vote_button" class="submit" style="display: none;">
</div>
<div class="thumb_up">
8-D
</div>
</div><input type="hidden" value="4847" name="vote_eid" id="vote_eid"> <input type="hidden" value="23339" name="user_id"> <input type="hidden" value="105" name="contest_id">
</form><br class="clear">
<div class="contest_image">
<img src="https://stackoverflow.com/users/kylebradshaw-3161-full.gif" style="display: inline;">
</div>
<div class="contest_content">
<div class="contest_metar">
<table class="contest_meta">
<tbody>
<tr>
<th>
Title
</th>
<td>
<b>hre's a title of the thing</b>
</td>
</tr>
<tr>
<th>
Description
</th>
<td>
and here's an image of the thing
</td>
</tr>
<tr>
<th>
Tags
</th>
<td>
<a href="/tag/heres+a+tag/">heres a tag</a>
</td>
</tr>
<tr>
<th>
Submitted by
</th>
<td style="vertical-align: text-top;" class="submitted_by">
<a href="/user/view/kylebradshaw/">kylebradshaw</a>
</td>
</tr>
<tr>
<th>
Share This
</th>
<td class="small">
<input type="text" size="46" value="http://cz3.kb.mechmedia.com/costume-rate/4847/" style="padding: 1px; margin-bottom: 4px;" class="text select_box small"><br>
</td>
</tr>
</tbody>
</table>
</div><br class="clear">
<div id="commentary">
<h2>
Commentary
</h2>
<div id="entry_comments">
<p>
None yet! Leave a comment!
</p>
</div><!-- end entry_comments -->
</div>
<div id="comment_here">
<h2>
Be the first to comment!
</h2>
<form method="post" action="/update/">
<p>
<textarea style="width: 90%;" rows="2" name="comment">
</p><input type="hidden" value="4847" name="entry_id"><input type="hidden" value="105" name="contest_id"><input type="hidden" value="add_comment" name="action"><input type="hidden" value="html" name="content_type">
<p>
<input type="submit" value="Add Your Comment" name="submit">
</p>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="s1-12" id="side_bar">
<div class="s_w">
<div id="next_up">
<h3>
Next
</h3>
<div class="img_container">
<img alt="" src="https://stackoverflow.com/users/Crow_Nest_Vintage-2411-thumb.gif">
</div>
<div class="img_container">
<img alt="" src="https://stackoverflow.com/users/mizzmedusa-2155-thumb.gif">
</div>
<div class="img_container">
<img alt="" src="https://stackoverflow.com/users/tantlaymance-2053-thumb.gif">
</div>
<div class="img_container">
<img alt="" src="https://stackoverflow.com/users/gulfcoastdiesel-2024-thumb.gif">
</div>
<div class="img_container">
<img alt="" src="https://stackoverflow.com/users/PokeyWoman-1578-thumb.gif">
</div>
</div>
<div id="new_up">
<h3>
New
</h3>
<div class="img_container">
<a href="/costume-rate/4877/"><img alt="" src="https://stackoverflow.com/users/kylebradshaw-3197-thumb.gif"></a>
</div>
<div class="img_container">
<a href="/costume-rate/4874/"><img alt="" src="https://stackoverflow.com/users/kylebradshaw-3190-thumb.gif"></a>
</div>
<div class="img_container">
<a href="/costume-rate/4873/"><img alt="" src="https://stackoverflow.com/users/kylebradshaw-3189-thumb.gif"></a>
</div>
<div class="img_container">
<a href="/costume-rate/4872/"><img alt="" src="https://stackoverflow.com/users/kylebradshaw-3188-thumb.gif"></a>
</div>
<div class="img_container">
<a href="/costume-rate/4871/"><img alt="" src="https://stackoverflow.com/users/kylebradshaw-3185-thumb.gif"></a>
</div>
</div>
</div>
</div>
<div class="s5-12 end" id="pre_bar">
<div class="s_w">
<div id="contest_results">
<h3>
<a href="/costume-rate/4848/">modal test</a> Voting Results
</h3>
<div class="contest_image left">
<img alt="modal test" src="https://stackoverflow.com/users/kylebradshaw-3162-full.gif">
</div>
<table class="contest_meta">
<tbody>
<tr>
<th>
Official Score
</th>
<td>
<span class="strong shout">6.0/10</span>
</td>
</tr>
<tr>
<th>
Votes
</th>
<td>
1 vote
</td>
</tr>
<tr>
<th>
You Voted
</th>
<td>
<b class="knock_out">6</b>
</td>
</tr>
<tr>
<th>
Submitted by
</th>
<td style="vertical-align: text-top;" class="submitted_by">
<a href="/user/view/kylebradshaw/">kylebradshaw</a>
</td>
</tr>
<tr>
<th>
Share This
</th>
<td class="small">
<input type="text" value="http://cz3.kb.mechmedia.com/costume-rate/4848/" style="padding: 1px; margin-bottom: 4px; width: 90%;" class="text select_box small"><br>
</td>
</tr>
</tbody>
</table>
</div><br class="clear">
<br class="clear">
<br class="clear">
<div class="section first" id="contest_info">
<h1>
<span class="costum">C</span><span class="zee">z</span> Costume Contest
</h1>
<table class="contest_meta contest_info">
<tbody>
<tr>
<th>
Name
</th>
<td>
<b>hats and such</b>
</td>
</tr>
<tr>
<th>
Started
</th>
<td>
<small>07/15/08</small>
</td>
</tr>
<tr>
<th>
Ends
</th>
<td>
<small style="margin-bottom: 3px; display: block;">05/13/11</small> <span class="notice">This contest ends in 1 year, 9 months</span>
</td>
</tr>
<tr>
<th>
Description
</th>
<td>
here is a contest dedicated to awesome hats
</td>
</tr>
<tr>
<td></td>
<td>
<a href="/costume-upload/?contest_id=105&typeof=contest&modal=1&KeepThis=true&TB_iframe=true&width=400&height=500" id="contest_upload" class="funnel thickbox" name="contest_upload">Enter this contest now!</a>
</td>
</tr>
</tbody>
</table><br class="clear">
</div>
<ul id="contests_list">
<li>
<a href="/contest/105">Hats And Such</a><br>
<small><b>12767</b> <em>votes</em></small>
<p>
here is a contest dedicated to awesome hats
</p>
</li>
<li>
<a href="/contest/107">General</a><br>
<small><b>3009</b> <em>votes</em></small>
<p>
This is the anything-goes general contest!
</p>
</li>
</ul>
</div>
</div><br class="clear">
</div>
기본적으로 IE는 대부분의 W3c 표준 코드를 싫어합니다. – rahul