Question

我已经将这段代码用于了mozilla，但是没有使用 webkit浏览器。

这是简单的脚本，点击带有指定值的，然后显示图片。然后是另一个人，被禁用attr。

任何人都可以帮助我解决为什么它不能在webkit中工作。

info：这是一个FB应用程序，在shortstack上工作

由于

代码：

<script type="text/javascript">
$(document).ready(function() {

$('#image,#image2,#image3,#image4,#image5').hide();

    $('option').click(function(e) {
    switch ($(this).attr('value')) {

      case 'ATENTA': 
        $("#image").show().click(function(){
            $(this).hide();
        });
        e.preventDefault();
        break;

      case 'CREATIVA':
        $("#image2").show().click(function(){
            $(this).hide();
        });    
        e.preventDefault();
        break;  

      case 'COQUETA':
        $("#image4").show().click(function(){
            $(this).hide();
        });        
        e.preventDefault();
        break;

      case 'PEGOTE': 
        $("#image3").show().click(function(){
            $(this).hide();
        });     
        e.preventDefault();
        break;

      case 'COLGADA':
        $("#image5").show().click(function(){
            $(this).hide();
        });    
        e.preventDefault();
        break;  
    }
    });

    $('select').change(function(){
    var value = $(this).val();
    $(this).children('option').each(function (){
      if ($(this).val() === value) {
          $(this).siblings('option').attr('disabled', true);
      }
        });
    });

});

Answer 1

我猜测不起作用的是图像的实际负载。我认为这是因为这段代码：

$('option').click(function(e) {

浏览器处理表单元素的方式不同。单击选项中的选项可能会触发firefox的“click”事件，但不会触发Chrome上的“click”事件。

尝试这样的事情：

$(document).ready(function() {

    $('#image,#image2,#image3,#image4,#image5').hide();


    $('select').change(function() {
        var value = $(this).val();

        $(this).children('option').each(function (){
            if ($(this).val() === value) {
                $(this).siblings('option').attr('disabled', true);
            }
        });

        switchImage(value);
    });

    var switchImage = function(toLoad) {
        switch (toLoad) {

          case 'ATENTA':
            $("#image").show().click(function(){
                $(this).hide();
            });
            break;

          case 'CREATIVA':
            $("#image2").show().click(function(){
                $(this).hide();
            });
            break;

          case 'COQUETA':
            $("#image4").show().click(function(){
                $(this).hide();
            });
            break;

          case 'PEGOTE':
            $("#image3").show().click(function(){
                $(this).hide();
            });
            break;

          case 'COLGADA':
            $("#image5").show().click(function(){
                $(this).hide();
            });
            break;
        }
        });
    };

});

这样做是使用select标签本身的'change'事件来调用switchImage函数，而不是依赖于option标签上的'click'事件。

jQuery脚本不能在webkit浏览器上运行

1 个答案: