0

私は現在、YouTubeビデオを既存のdivにロードするAJAXベースの機能に取り組んでいます。その部分はうまく機能しています。

ここで、コードを変更して、各ビデオの非表示のタイトルと説明を取得し、このデータをビデオの上下に追加できるようにします (タイトルは YouTube ビデオの上に、説明は下にある必要があります)。

問題は、この変更を誰が達成するかわからないことです。ここに私がこれまでに持っているものがあります:

私のJavascript：

<script language="javascript" type="text/javascript">

    function SendValue(v) {
            xmlHttpReq = new XMLHttpRequest();
            xmlHttpReq.onreadystatechange = HandleValue;
            xmlHttpReq.open("GET", "srcsendback2.php?code="+v,true);
            xmlHttpReq.send();
            }


    function HandleValue(Code) {
            if(xmlHttpReq.readyState == 4) {
                if(xmlHttpReq.status == 200) {

                    var Code;
                    var CodeTitle;
                    var CodeDesc;
                    var Code = xmlHttpReq.responseText;

                    CodeTitle = code + "-title";
                    CodeDesc = code + "-desc";



                    document.getElementById('vidtitle').innerHTML = document.getElementsByClassName('CodeTitle').innerHTML
                    document.getElementById('viddesc').innerHTML = document.getElementsByClassName('CodeDesc').innerHTML
                    document.getElementById('ytvid').src = document.getElementsByClassName('Code')[0].getElementsByTagName('a')[0].href

                    window.scroll(0,0); // horizontal and vertical scroll targets, scrolls page to the top
                } 
            }       
</script>

そして、ここにHTMLの例があります：

        <h1 id="vidtitle"></h1>
        <div id="videoDiv">
            <iframe id="ytvid" width="500" height="300" frameborder="0" src="http://www.youtube.com/embed/xyz" frameborder="0" allowfullscreen></iframe>
        </div>
        <p id="viddesc"></p>


        <div id="links">



                <button type="button" name="button" onClick="SendValue('abc')" value="http://www.youtube.com/embed/123">Title 1</button> <br />

                <button type="button" name="button" onClick="SendValue('def')" value="http://www.youtube.com/embed/456">
Title 2</button> <br />

                <button type="button" name="button" onClick="SendValue('ghi')" value="http://www.youtube.com/embed/789">Title 3</button> <br />


            <div id="content" style="display:none;">

                <ul class="media-collection">

                    <li>
                        <div class="m-left">
                            <a href="#">
                        </div>

                        <div class="m-right">

                            <p class="CodeTitle">
                                <a href="http://www.youtube.com/embed/123">
                                    <span class="field-content">Title 1</span>
                                </a>
                            </p>

                            <p></p>

                            <div class="CodeDesc">
                                <p>
                                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur convallis metus et lectus venenatis rhoncus. Suspendisse potenti. Maecenas bibendum nisi ut velit luctus ultricies. Mauris at nibh a elit pretium varius. Nunc accumsan sagittis augue at facilisis. Phasellus et ante lorem, vitae laoreet enim. Donec vulputate, velit a lobortis eleifend, neque nibh rhoncus quam, non pharetra turpis mauris sed ligula. Ut rhoncus, felis ac scelerisque volutpat, turpis elit malesuada ante, vel varius lorem erat dapibus mi. Nullam nulla risus, aliquam sed tempus eu, dictum a est. 
                                </p>
                            </div>

                            <p></p>

                        </div>
                    </li>

                </ul>

            </div>

        </div>

私の問題を明確に説明できなかった場合は、お詫び申し上げます。

どんな助けでも感謝します。

4

1 に答える 1

0

タイトルを見つけるには、次のようにします。

  var p = document.getElementsByClassName('CodeTitle')[0];
  var span = p.getElementsByTagName('span')[0];
  alert(span.childNodes[0].nodeValue);

これを行うときは、次のことに注意してください。

xmlHttpReq.onreadystatechange = HandleValue;

...将来の日付でjsに呼び出させたい関数をjavascriptに与えています。そして、js がその関数を呼び出すとき、js は引数を指定して呼び出すことはありません。

于 2013-06-05T12:11:28.027 に答える