原因:我的網站將潮汐時間作為一個小功能(因此不是主要功能)。
內容:作為潮汐時間功能的一部分,我想為用戶提供一組“下拉”選項來選擇位置,并且默認潮汐時間會隨著用戶的選擇而更新。
為什么它不起作用:選擇一個選項后,表格消失。它不應該消失。它應該使用所選位置進行更新。
希望得到一些幫助/指導。 在過去的一周里,它一直讓我發瘋。
長摘要: 我正在將站點連接在一起,并且我有一個潮汐時間小部件/html 片段。只有該片段不附帶用戶更改位置的選項。我希望自定義 html 頁面以包含下拉串列,并且選擇的值替換 src url 位置。然后小部件更新更改(而不是整個頁面)。
我在這里學到了很多東西。但我是新手——所以也許我違反了一些基本規則。
希望得到一些幫助/指導。在過去的一周里,它一直讓我發瘋。
我一直在研究,下面的代碼就是我想出的。
<select onChange="ChangeLocation(value)">
<option value="-">Select region</option>
<option value="barry">Barry</option>
<option value="aldeburgh">Aldeburgh</option>
</select>
<script type="text/javascript">
function ChangeLocation(value)
{
var s = document.createElement("script");
s.type = "text/javascript";
s.src = "https://www.tidetimes.org.uk/" value "-tide-times.js";
s.id = "tidetable";
s.async = true;
document.getElementById("output").innerHTML = "";
document.getElementById("output").appendChild(s);
}
</script>
<div id="output">
<script id="tidetable" type="text/javascript" src="https://www.tidetimes.org.uk/aldeburgh-tide-times.js"></script>
</div>
uj5u.com熱心網友回復:
我已經使用https://github.com/krux/postscribe中的“postscribe”解決了這個問題。
我在<script>標簽中使用來自cdn的postscribe:
<script src="https://cdnjs.cloudflare.com/ajax/libs/postscribe/2.0.8/postscribe.min.js"></script>
然后,<body>標簽的內容如下:
<select onChange="ChangeLocation(value)">
<option value="-">Select region</option>
<option value="barry">Barry</option>
<option value="aldeburgh">Aldeburgh</option>
</select>
<script type="text/javascript">
function ChangeLocation(value) {
var s = document.createElement("script");
s.src = "https://www.tidetimes.org.uk/" value "-tide-times.js";
document.getElementById("output").innerHTML = "";
postscribe('#output', s.outerHTML);
}
</script>
<div id="output"></div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/420386.html
標籤:
