-1 
<script type="text/javascript">
    function bookRetr(str) {
        if (str == "") {
            document.getElementById("more-info").innerHTML="";
            return;
        } 

        if (window.XMLHttpRequest) {
            // code for IE7+, Firefox, Chrome, Opera, Safari
            xmlhttp = new XMLHttpRequest();
        }
        else {
            // code for IE6, IE5
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }

        xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("more-info").innerHTML=xmlhttp.responseText;
            }
        }

        xmlhttp.open("GET","showbook.php?id="+str,true);
        xmlhttp.send();
    }
</script>

<div class="bookProp" id="one" onClick="bookRetr(this.id)">
    <div class="booknoHolder" id="in">&nbsp;01&nbsp;</div>
</div>

<div class="bookProp" id="two" onClick="bookRetr(this.id)">
    <div class="booknoHolder" id="in">&nbsp;02&nbsp;</div>
</div>

<div class="bookProp" id="three" onClick="bookRetr(this.id)">
    <div class="booknoHolder" id="in">&nbsp;03&nbsp;</div>
</div>

このスクリプトは正常に実行され、ブック情報をロードして id にロードするという、私が望んでいた作業を実行しますmore-info。booknoHolder しかし、 div クラスをクリックすると、 div クラスも非表示/削除したいと思いますbookProp。いくつかの jQuery コードを試してみましたが、何も機能していません。div クラスbookPropは実際には PHP の while ループによって生成されるため、エントリの数は動的になります。

4

4 に答える 4

3

jQuery を使用していると言いますが、コードに jQuery が表示されません。ただし、jQuery でいくつかの要素を非表示にしたい場合は、次のようにすることができます。

$('.booknoHolder').hide();

booknoHolderをクリックしたときに要素を非表示にする場合は、次のようにbookPropします。

$(function() {
    $('body').on('click', '.bookProp', function() {
        $(this).find('.booknoHolder').hide();
    });
});

詳細については、http : //api.jquery.com/on/を参照してください。

于 2012-12-17T08:44:01.240 に答える
0 
function bookRetr(str) {
        if (str == "") {
            document.getElementById("more-info").innerHTML="";
            return;
        } 

        $("#" + str + " .booknoHolder").hide();
        ...
于 2012-12-17T08:52:38.620 に答える
0

この方法は役に立ちますか

xmlhttp.onreadystatechange = function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById("more-info").innerHTML=xmlhttp.responseText;
                if(str=="one") { 
                document.getElementById("one").style.display="block";
                document.getElementById("two").style.display="none";
                document.getElementById("three").style.display="none";
}
                if(str=="two") { 
 document.getElementById("one").style.display="none";
                document.getElementById("two").style.display="block";
                document.getElementById("three").style.display="none";
}
                if(str=="three") {
 document.getElementById("one").style.display="none";
                document.getElementById("two").style.display="none";
                document.getElementById("three").style.display="block";
 }
            }
        }
于 2012-12-17T08:56:59.823 に答える
0

jQuery ソリューションの場合は、これを試してください。

<script type="text/javascript">
    function bookRetr(str) {
        // Get the HTML via AJAX
        $.get('showbook.php?id=' + str, function(html) {
            $("#more-info").html(html);
        });

        // Assuming .bookProp is appended inside #more-info
        $('#more-info').on('click', '.bookProp', function() {
            $('.booknoHolder', $(this)).hide();
        });
    }
</script>
于 2012-12-17T08:49:56.847 に答える