Простой jQuery Hide / Show не работает в IE - PullRequest
0 голосов
/ 08 мая 2009
$(document).ready(function(){  
$('#createGallery').hide();

$("#newGallery").click(function () {
        $("#createGallery").show('slow');
});
$("#gallerySelect > option").not("#newGallery").click(function () {
    $("#createGallery").hide('slow');
});

});

Я не могу понять, почему. Кажется, достаточно просто. мой HTML в HAML. Но это легко понять, если вы не знаете, что такое HAML. Мой ХАМЛ гласит:

        #createGallery
          %span{ :style => "color:#1B75BC; font-size: 15px;" }
            new gallery
          %br
          %form{ :action => ""}
            %input{ :name => "tabname", :type => "text", :rows => "1", :cols => "30", :style => "height: 15px; width: 260px; margin-right: 40px;"}

        %span{ :style => "color:#1B75BC; font-size: 15px;" }
          gallery

        %form{ :action => ""}
          %select#gallerySelect{ :name => "Choose Gallery", :style => "width:260px" }
            %option{ :selected => "selected", :value => "QuickFact" }
              Choose Gallery
            %option{ :value => "QuickFact"}
              My Interior Design
            %option#newGallery{ :value => "QuickFact" }
              New Gallery
        %br

Ответы [ 3 ]

4 голосов
/ 08 мая 2009

Я не верю, что элементы OPTION имеют события щелчка. Вы захотите прикрепить обработчик щелчка к элементу SELECT, а затем проверить выбранную опцию. \

(отказ от ответственности: воздушный код)

$(document).ready(function(){
    $('#createGallery').hide();
    $("#gallerySelect").click(function () {
        if (this.options[this.selectedIndex].id == 'newGallery') {
            $("#createGallery").show('slow');
        } else {
            $("#createGallery").hide('slow');
        }
    });
});
0 голосов
/ 08 мая 2009

Все ваши элементы option имеют одинаковое значение ... Обычно этот элемент используется не так. Кроме того, если вы собираетесь скрыть свой элемент сразу, вы можете просто установить его в своем HAML (если, конечно, вы не хотите, чтобы пользователи, не являющиеся JS, видели его по умолчанию). Было бы больше смысла, если бы вы сделали что-то вроде этого:

$(function(){ 
    $("#gallerySelect").bind('change',function () {
        if($(this).val() == 'newGallery') {
            $("#createGallery").show('slow');   
        } else {
            $("#createGallery").hide('slow');
        }    
    });

});

С HAML что-то вроде этого:

    #createGallery{:style => "display:none;" }
      %span{ :style => "color:#1B75BC; font-size: 15px;" }
        new gallery
      %br
      %form{ :action => ""}
        %input{ :name => "tabname", :type => "text", :rows => "1", :cols => "30", :style => "height: 15px; width: 260px; margin-right: 40px;"}

    %span{ :style => "color:#1B75BC; font-size: 15px;" }
      gallery

    %form{ :action => ""}
      %select#gallerySelect{ :name => "Choose Gallery", :style => "width:260px" }
        %option{ :selected => "selected", :value => "chooseGal" }
          Choose Gallery
        %option{ :value => "designInterior"}
          My Interior Design
        %option{ :value => "newGallery" }
          New Gallery
    %br
0 голосов
/ 08 мая 2009

Это поможет получить HTML для текущей страницы, а также узнать немного больше о проблеме.

  • В какой версии IE возникла проблема?
  • Это просто скрытие / отображение #createGAllery, которое не работает, или событие click вообще не срабатывает?
  • Что возвращает alert($("#gallerySelect > option").not("#newGallery").length); или alert($("#gallerySelect > option").length);?
...