Question

我在从外部源调用Jquery时遇到了一些问题。如果我嵌入这个外部源，整个页面运行Jquery，它会导致页面上不同模块的一些兼容性问题。

我想做的是调用Jquery一次，并在它运行一点点html后关闭它，但我似乎无法做到这一点，我设置了一个JS小提示来显示我的问题。小提琴不起作用，但我希望它提供了我的问题的一个例子

<head>
<link rel="stylesheet" type="text/css" href="http://www.khl.com/other_files/929.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
var gstock = ["TYO:5233", "HKG:1893", "HKG:2009", "BIT:IT", "ASX:BLD", "TPE:1101", "NYSE:VMC", "TYO:5232", "NYSE:MLM", "BME:CPL", "HKG:1666", "BKK:SCC"];
$(document).ready(function () {
    for (var i = 0; i < gstock.length; i++) {
        $.getJSON("https://finance.google.com/finance/info?client=ig&q=" + gstock[i] + "&callback=?", function (response) {
            var stockInfo1 = response[0];
            var divContainer = $('*[data-symbol="' + stockInfo1.t + '"]');
            var divCurrency = $('*[data-currency="' + stockInfo1.d + '"]');
            var percentStock = !isNaN(stockInfo1.c) && !isNaN(stockInfo1.l) && stockInfo1.l ? ((parseFloat(stockInfo1.c)/parseFloat(stockInfo1.l)) * 100) : undefined;
            var stockString1 = '<div class="stockWrapper">' + divContainer.data('title') + ':';
            var stockName1 = stockInfo1.t;
            var stockCurency1 = stockInfo1.d;
            var stockPrice2 = "";

            stockPrice2 += '<span class="stockSymbol "> ' + stockInfo1.l + '</span>';     
            var stockChange = "";
            stockString1 += '<span class="stockSymbol "> ' + stockInfo1.t + ' </span>';
            if(!isNaN(percentStock) && percentStock > 0) {
                percentStock = Number((percentStock).toFixed(2));
                stockChange += '<span class="stockChange "> ' + percentStock + ' %</span>';
            } else if(!isNaN(percentStock)) {
                percentStock = Number((percentStock).toFixed(2));
                stockChange += '<span class="stockPrice "> ' + percentStock + ' %</span>';
            } else {
                stockChange += '<span class="stockPrice "></span>';
                stockChange += percentage + '% </span>';               

            }
            stockString1 += stockChange + '</div>';
            $("#title").append("<div>" + divContainer.data('title') + "</div>");
            $("#symbols").append("<div><b>" + stockInfo1.t + "</b></div>");
          $("#currency").append("<div><b>" + $(divContainer).attr( 'data-currency') + "</b></div>");
            $("#livePrice").append("<div>" + stockPrice2 + "</div>");
            $("#liveData").append("<div>" + stockChange + "</div>");
            divContainer.append(stockString1);



        });
    }
});<script></head>

<body>
<div class="container">
<div class="marquee"> 
<div class="19300" data-symbol="5233" data-title="TAIHEIYO" data-currency="JPY" style="display: none;" ></div>
<div class="19400" data-symbol="1893" data-title="CNMC" data-currency="USD" style="display: none;" ></div>
<div class="19500" data-symbol="2009" data-title="BBMG" data-currency="HKD" style="display: none;" ></div>
<div class="19600" data-symbol="IT" data-title="ITALCEMENTI" style="display: none;" ></div>
<div class="19700" data-symbol="BLD" data-title="BORAL" data-currency="AUD" style="display: none;" ></div>
<div class="19800" data-symbol="1101" data-title="TAIWAN CEMENT" data-currency="NTD" style="display: none;" ></div>
<div class="19900" data-symbol="ULTRA" data-title="UTC" data-currency="USD" style="display: none;" ></div>
<div class="20000" data-symbol="5232" data-title="SUMITOMO" data-currency="JPY" style="display: none;" ></div>
<div class="20100" data-symbol="VMC" data-title="VULCAN MATERIALS" data-currency="USD" style="display: none;" ></div>
<div class="20300" data-symbol="MLM" data-title="MARTIN MARIETTA" data-currency="USD" style="display: none;" ></div>
<div class="20500" data-symbol="CPL" data-title="CPV" data-currency="EUR" style="display: none;" ></div>
<div class="20600" data-symbol="1666" data-title="TONG YANG" data-currency="HKD" style="display: none;" ></div>
<div class="20700" data-symbol="SCC" data-title="CIAM" data-currency="THB" style="display: none;" ></div>
<div class="box">
<div id="title" class="floatleft2"></div>
<div id="currency" class="floatleft999"></div>
<div id="livePrice" class="floatleft20"></div>
<div id="liveData" class="floatleft9"></div>
</div></div>
</div>
</body>

上面显示了我尝试运行Jquery，然后是它下面的html。然后我希望一切都能结束。

我知道这不是开展业务的通常方式，但后来在同一页面中我想调用一个非常类似的jquery来输出更多的股票。由于API使用相同的名称并且不会在我的屏幕上输出，因此jquery与前一篇文章冲突的类似情况会发生什么。所以我只能得到一个代码片段

我很可能会因为我是新手而犯错，但任何帮助都会受到赞赏。

JS-fiddle：https://jsfiddle.net/54p3o3aw/1/

最终，我试图在同一页面上复制此代码两次，没有任何冲突： https://jsfiddle.net/jhm7po6d/5/

在Jquery中调用一次，而不是作为外部源

0 个答案: