2014-02-22 48 views
0

2對格這一翻譯我做了一個按鈕,它被示出,並通過使用jQuery上點擊隱藏div。但IE顯示另一個額外的div和其他瀏覽器正確顯示它。IE表示一個

<div class="hide-search-button"> 
    <div class="l-f-w" id="locate"> 
    <h1> Location </h1> 
     <input type="hidden" value="" id="loc_hidden"/> 

     <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
    <td><h1>State</h1></td> 
    <td> <select onChange="selectCity(this.options[this.selectedIndex].value)" name="state_name" id="state_name"> 
    <option value="Choose">Choose</option> 
    <?php 

    //connect with database 
$sqlCountry="select DISTINCT state from sheet1 
      order by state asc "; 
$resCountry=mysql_query($sqlCountry); 
$checkCountry=mysql_num_rows($resCountry); 
// fetch all country 
    while($rowCountry=mysql_fetch_array($resCountry)){ 
    ?> 
    <option value="<?php echo $rowCountry['state']?>"> 
      <?php echo $rowCountry['state']?> 
    </option> 
    <?php 
    } 
    ?> 
</select></td> 
    </tr> 
    <tr> 
    <td><h1>Region</h1></td> 
    <td><select id="region_name" name="region_name" 
    onchange="selectState(this.options[this.selectedIndex].value)"> 
<option value="Choose">Choose</option> 
</select> 
     </td> 
    </tr> 
    <!--<tr> 
    <td><h1>Suburb</h1></td> 
    <td><select id="suburb_name" name="suburb_name"> 
<option value="Choose">Choose</option> 
</select></td> 
    </tr>--> 
    <tr> 
    <td><h1>Pin Code</h1></td> 
    <td> <input type="text"value=" " name="pin" id="pin"></td> 
    </tr> 
</table>   

<input type="hidden" value="2" name="searchform" />  
<script> 
function span_go() 
{ 
//var locate = document.getElementById("menuSelection").innerHTML; 
var service = document.getElementById("sertype").innerHTML; 
//document.getElementById("locatetext").value = locate; 
document.getElementById("servicetext").value = service; 
//alert (service); 
} 
</script> 
    <input type="hidden" value="" id="servicetext" name="servicetext"/> 
     <?php /*?><a tabindex="0" href="menuContent.html" class="fg-button fg-button-icon-right ui-widget ui-state-default ui-corner-all" id="flyout"><div class="arrow_wrap"><span class="ui-icon ui-icon-triangle-1-s"></span> </div> <span id="menuSelection"> <?php echo $location ?></span></a><?php */?> 

    </div> <!-- location field wrapper ends here --> 

    <div class="service_type_wrap s-t-w"> 
    <h1> Service Type </h1> 
     <select multiple="multiple" label="choose" style="margin-left:8px;" name="tex_value" id="worktype"> 

     <option value="Long Day Care">Long Day Care</option> 

     <option value="Occasional Care">Occasional Care</option> 

     <option value="In Home Care">In Home Care</option> 

     <option value="Before School Care">Before School Care</option> 

     <option value="After School Care">After School Care</option> 

     <option value="Vacation">Vacation Care</option> 

     <option value="Special Care">Special Care</option> 

     <option value="Permanent/Contract">Permanent/Contract</option> 

      <option value="Part time">Part time</option> 

     </select> 
    </div> <!-- service type wrapper ends here --> 

    <div class="f-r-w" style="margin-left:10px;"> 
    <h1> Filter Results </h1> 
     <select data-placeholder="<?php echo $sorting; ?>" class="chzn-select" style="width:200px;" tabindex="2"name="q_state" id="jobsort"> 



      <option value="title">Sort by job title</option> 

      <option value="date">Sort by date</option> 

     </select> 
    </div> <!-- filter results wrapper ends here --> 


    <div class="go_button_wrap"> 
    <input name="submit" type="submit" value="Go" id="custum_button" onclick="span_go();"> 
    </div> <!-- go button ends here --> 
</form> 

</div> 

JS:如下圖所示

$(document).ready(function() { 
    $("#button").toggle(function() { 
     //$(this).text('Hide Advance Search'); 
    }, function() { 
     //$(this).text('Show Advance Search'); 
    }).click(function(){ 
     $(".hide-search-button").slideToggle("slow"); 
     event.preventDefault(); 
    }); 
}); 

截圖:

enter image description here

+0

顯示您的html結構。 –

+0

如果您可以發佈您創建的按鈕的html標記,它將有助於回答您的問題。 – Zack

+0

您使用的切換()',它已在jQuery的1.9被拆除的'不推薦使用的形式。見http://forum.jquery.com/topic/beginner-function-toggle-deprecated-what-to-use-instead您應如何取代它。 – Barmar

回答

1

試圖改變單擊代碼的一部分。您需要將事件對象傳遞給處理程序。在IE中實際上有window.event的對象。也許它會導致問題:

.click(function(event) { 
    $(".hide-search-button").slideToggle("slow"); 
    event.preventDefault(); 
}); 
+0

jQuery的工作,但仍表現出額外的div。 –

+0

沒有人可以幫助..? –