以特定窗口大小打开链接

时间:2018-12-20 19:36:03

标签: javascript html

我有一个运行良好的随机图像脚本。我正在尝试打开一个不希望使用的特定窗口大小的链接,并将其应用于随机图片链接。

如果不在随机图像脚本中,则效果很好。

有什么方法可以使其在随机图像脚本中运行?

这是我的代码:

<SCRIPT LANGUAGE="Javascript">
function banner() { } ; b = new banner() ; n = 0

b[n++]= "<a href='https://youtu.be/IeIqaNR5Zs4' target='_blank'    
onclick='window.open(href,                '', 'height=300, width=450,  
left=300, top=300'); return false;'> <IMG name=randimg 
SRC='images/random/balboapark.png' alt='Balboa Park Picture'>"

b[n++]= "<a href='https://www.youtube.com/watch?v=w6UzpzMwwT8'> <IMG  
name=randimg SRC='images/random/zoo.png' alt='San Diego Zoo Picture'>"

b[n++]= "<a href='https://www.youtube.com/watch?v=w6UzpzMwwT8'> <IMG 
name=randimg SRC='images/random/zoo.png' alt='San Diego Beach Picture'>"

i=Math.floor(Math.random() * n) ; 
document.write( b[i] )
</SCRIPT>



This opens in the specific window size.

<a target="_blank" href="https://youtu.be/IeIqaNR5Zs4" 
onclick="window.open    (href,                '', 'height=300, width=450, 
left=300, top=300'); return false;"><IMG SRC='images/random/balboapark.png' 
alt='Balboa Park Picture'></a>

1 个答案:

答案 0 :(得分:2)

如果我正确理解了您的问题,那么这段代码应该可以满足您的要求。这种方法不是使用document.write(),而是直接与DOM API交互,并且还为click事件使用事件侦听器来触发window.open()

请注意,此代码在堆栈溢出代码段“ sandbox”中不起作用,因此您需要直接在自己的项目中尝试此解决方案:

// Function configures DOM elements for a single banner based 
// on provided input parameters
function createBanner(url, src, alt) {

  // Create the image and assign alt/src attributes
  let img = document.createElement('img');
  img.setAttribute('src', src);
  img.setAttribute('alt', alt);

  // Create the anchor, assign attributes and click listener
  let a = document.createElement('a');
  a.setAttribute('href', url);
  a.addEventListener('click', function() {

    window.open(url, '', 'height=300, width=450, left=300, top=300');
    return false
  });

  // Add image to anchor
  a.appendChild(img);

  // Return anchor for external use
  return a
}

// Create banners from your input data
[
  createBanner('https://youtu.be/IeIqaNR5Zs4', 'images/random/balboapark.png', 'Balboa Park Picture'),
  createBanner('https://youtu.be/w6UzpzMwwT8', 'images/random/zoo.png', 'San Diego Zoo Picture'),
  createBanner('https://youtu.be/w6UzpzMwwT8', 'images/random/beach.png', 'San Diego Beach Picture'),
]
.forEach(function(e, i, array) {

  // Iterate through each banner, and for each banner, 
  // select a random banner from the collection to be
  // added to the DOM
  const banner = array[Math.floor(Math.random() * array.length)];
  
  document.body.appendChild(banner);
})