3

私は学校のプロジェクトに取り組んでおり、ワンクリックで複数のドキュメントを開く必要があります。画像スライダーを使用していて、複数のリンクを開くことができました。ただし、スライダー上の別の画像に同じJavaScriptを追加すると、ソースを変更した場合でも、以前と同じJavaScriptが開きます。

 <img src="promo.png" img class="carousel-image" onclick="doOpen()">


   <script type="text/javascript">
function doOpen()
{
window.open("Ticket.png");
window.open("Pattern.png");

}
</script>



          <div class="carousel-caption">
            <p>
              The Complete set of useful documents
            </p>
          </div>
        </div>
        <div class="carousel-feature">
           <img src="promo.png" img class="carousel-image" onclick="doOpen()">

<script type="text/javascript">
function doOpen()
{
window.open("screensaver.mp4");
window.open("Billboard.png");
window.open("Tshirt.png");


}
</script>

          <div class="carousel-caption">

スライダーの両方の画像が開きticket.pngpattern.png

4

1 に答える 1

2

同じ関数を2回定義していますdoOpen。それはうまくいきません。簡単な修正については、これを試してください。

<img src="promo.png" class="carousel-image" onclick="doOpen1()">

<script type="text/javascript">
function doOpen1()
{
    window.open("Ticket.png");
    window.open("Pattern.png");
}
</script>

      <div class="carousel-caption">
        <p>
          The Complete set of useful documents
        </p>
      </div>
    </div>
    <div class="carousel-feature">
       <img src="promo.png" class="carousel-image" onclick="doOpen2()">

<script type="text/javascript">
function doOpen2()
{
window.open("screensaver.mp4");
window.open("Billboard.png");
window.open("Tshirt.png");
}
</script>

とはいえ、すべてのリンクに対してこのような関数を定義することは、堅牢なソリューションではありません。さらに良いものは次のとおりです。

<script type="text/javascript">
function doOpen(which)
{
    if(which == "one"){
        window.open("Ticket.png");
        window.open("Pattern.png");
    } else if (which == "two"){
        window.open("screensaver.mp4");
        window.open("Billboard.png");
        window.open("Tshirt.png");
    }
}
</script>

<div class="carousel-feature">
  <img src="promo.png" class="carousel-image" onclick="doOpen('one')">
</div>

<div class="carousel-feature">
   <img src="promo.png" class="carousel-image" onclick="doOpen('two')">
</div>

これには、1つの関数を維持するだけで済みますが、リンクごとに多くの関数を維持する必要があります。

imgまた、タグに余分なものがあります。

<img src="promo.png" img class="carousel-image" onclick="doOpen2()">
                     ^^^ Here
<!-- Should Be: -->
<img src="promo.png" class="carousel-image" onclick="doOpen2()">

Jasonによって提案されたオプションは次のようになります。

<script type="text/javascript">
function doOpen()
{
    for (var i = 0; i < arguments.length; i++){
        window.open(arguments[i]);
    }
}
</script>

<div class="carousel-feature">
  <img src="promo.png" class="carousel-image" onclick="doOpen('Ticket.png', 'Pattern.png')">
</div>

<div class="carousel-feature">
   <img src="promo.png" class="carousel-image" onclick="doOpen('screensaver.mp4', 'Billboard.png','Tshirt.png')">
</div>

ここでの違いは、関数が変更されることはありませんが、毎回異なる方法で呼び出すことです。

于 2013-03-19T16:48:18.823 に答える