0

私はこのコードを持っています。基本的に、私がやりたいのは、cpu_divをクリックすると、all_cpu divを表示し、all_cpu divをクリックすると、cpu_divを表示することです。アイデアは、divを前後に切り替えることです。

html code:

<div id="cpu_all"> </div>
<div id="cpu_div"></div>


       var serverA = "http://url/cpu.png";
       $("#cpu_div").click(function () {
        var myImage = new Image();
        $(myImage).load(function () {

            $('#all_cpu').show();
            $("#all_cpu").html(myImage);

        }).error(function () {
            $('#all_cpu').hide();
         }).attr('src', serverA)
    });

    $("#all_cpu").click(function () {
        $('#all_cpu').hide();
        $("#cpu_div").show();
    });

cpu_divをクリックすると、all_cpu divが表示されますが、all_cpu divをクリックすると、何も起こりません。誰でもここで何が悪いのかを見るためにチャイムを鳴らすことができますか？

4

3 に答える 3

1 
$("#cpu_div, #all_cpu").on('click', function() {
    $("#cpu_div, #all_cpu").not(this).show();
    $(this).hide();
});

それでも機能しない場合は、これを試してみてください。

$(document).on('click', '#cpu_div, #all_cpu', function() {
    $("#cpu_div, #all_cpu").not(this).show();
    $(this).hide();
});

また、私の意見では、ネイティブのonload関数を使用することをお勧めします。

$("#cpu_div, #all_cpu").on('click', function() {
    var myImage = new Image();

    myImage.src = 'http://url/cpu.png';
    myImage.onload = function() {
         //do stuff
    }
});
于 2012-09-27T18:56:31.690 に答える
0

@Adrianが示唆しているように、HTMLなしでは何が起こっているのかを知ることはできませんがtoggle()、これら2つのdivの可視性が必要なようです。

$("#all_cpu,#cpu_div").click(function () {
    $('#all_cpu').toggle();
    $("#cpu_div").toggle();
});
于 2012-09-27T18:55:03.037 に答える
0

問題は、画像を読み込もうとした後にattr（'src'）を設定することです。コードをに変更する

 $(myImage).attr('src', serverA).load(...)

それを修正します。

于 2012-09-27T19:01:57.293 に答える