3

我正在做一个学校项目，我需要一键打开多个文档。我正在使用图像滑块，并且设法让它打开多个链接。但是，一旦我将相同的 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.png并且pattern.png。

4

1 回答 1

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>

这只需要您维护一个功能，而不是为您拥有的每个链接维护多个功能。

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 回答