Question

我使用名为finviz.com的网站提供股票图表。我喜欢在不同的时间范围内查看图表，一个在另一个上面。我一直在使用excel来做到这一点。例如。如果我在单元格A1中输入“aapl”，我在excel中使用一个简单的连接公式来组合我需要的超链接，如下所示：

<img src = 'http://elite.finviz.com/chart.ashx?t=aapl&ty=c&ta=st_c,sch_100,sma2_50,sma2_20,sma2_100,stofu_b_5_3_3&p=d&s=l'><br>
<img src = 'http://elite.finviz.com/chart.ashx?t=aapl&ty=c&ta=0&p=i15&s=l'><br>
<img src = 'http://elite.finviz.com/chart.ashx?t=aapl&ty=c&ta=0&p=i3&s=l'>[/code]

然而，这是非常缓慢的。对于每个不同的自动收报机，我需要将excel文本复制/粘贴到桌面上的html文件中并刷新我的Chrome浏览器。我希望在我的html代码中有一个输入字段，让我输入一个股票代码，然后动态更新不同股票的html代码。

有人可以建议怎么做吗？

Answer 1

一种方法是设置输入框和按钮，然后使用jQuery更新图像源。

在HTML中添加一个新的输入框和按钮，并为图片提供ID：

<input type="text" id="tickerCode" /><input type="button" id="setTicker" value="Set Ticker" />

<img id="ticker1" src = 'http://elite.finviz.com/chart.ashx?t=aapl&ty=c&ta=st_c,sch_100,sma2_50,sma2_20,sma2_100,stofu_b_5_3_3&p=d&s=l'><br>
<img id="ticker2" src = 'http://elite.finviz.com/chart.ashx?t=aapl&ty=c&ta=0&p=i15&s=l'><br>
<img id="ticker3" src = 'http://elite.finviz.com/chart.ashx?t=aapl&ty=c&ta=0&p=i3&s=l'>

现在点击新按钮：

$('#setTicker').click(function () {
    $('#ticker1').attr("src", 'http://elite.finviz.com/chart.ashx?t=' + $('#tickerCode').val() + '&ty=c&ta=st_c,sch_100,sma2_50,sma2_20,sma2_100,stofu_b_5_3_3&p=d&s=l');
    $('#ticker2').attr("src", 'http://elite.finviz.com/chart.ashx?t=' + $('#tickerCode').val() + '&ty=c&ta=0&p=i15&s=l');
    $('#ticker3').attr("src", 'http://elite.finviz.com/chart.ashx?t=' + $('#tickerCode').val() + '&ty=c&ta=0&p=i3&s=l');

});

Answer 2

如果你不想使用JQuery，这是一个简单的JavaScript版本的intracept非常好的代码。

<input type="text" id="tickerCode" /><input type="button" id="setTicker" value="Set Ticker" />

<img id="ticker1" src = 'http://elite.finviz.com/chart.ashx?t=aapl&ty=c&ta=st_c,sch_100,sma2_50,sma2_20,sma2_100,stofu_b_5_3_3&p=d&s=l'><br>
<img id="ticker2" src = 'http://elite.finviz.com/chart.ashx?t=aapl&ty=c&ta=0&p=i15&s=l'><br>
<img id="ticker3" src = 'http://elite.finviz.com/chart.ashx?t=aapl&ty=c&ta=0&p=i3&s=l'>
<script>
document.getElementById('setTicker').addEventListener('click', function () {
  var symbol = document.getElementById('tickerCode').value;
  document.getElementById('ticker1').src = 'http://elite.finviz.com/chart.ashx?t=' + symbol + '&ty=c&ta=st_c,sch_100,sma2_50,sma2_20,sma2_100,stofu_b_5_3_3&p=d&s=l';
  document.getElementById('ticker2').src = 'http://elite.finviz.com/chart.ashx?t=' + symbol + '&ty=c&ta=0&p=i15&s=l';
  document.getElementById('ticker3').src = 'http://elite.finviz.com/chart.ashx?t=' + symbol + '&ty=c&ta=0&p=i3&s=l';
});
</script>

基于表单输入动态更新html文件

2 个答案: