下面這段代碼完全適用于測驗，我只是在Visual Studio Code（https://code.visualstudio.com/）中使用它，并從Live Server擴展中創建頁面（https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer）：
<html>
<head>
</style>
<script src="https://d3js. org/d3.v4.js"></script>>
</head>
<body style="background-color:black;">
<div class=" row">
<div class="column left"/span>>
< form action="" method="post" id="formulario-radar-1" >
<div id="caixa-suspensa-1"/span>>
< button class="button" id="bootao-do-radar-1" onclick="funcao_radar_1()"> 雷達1</button>
< input type="text" id="barra-de-texto-para-radar-1" style="width: 283px;">
</div>/span>
</form>
< iframe id="iframe-do-radar-1" width="100%" 高度="282" frameBorder="0" src=">。
</iframe>
<script id="script-da-caixa-de-selecao-suspensa-1">/span>
var select_1 = d3.select("#caixa-suspensa-1"/span>)
.append("select")
.attr("id"，"select-box-1")
.style("width","100%") 。
function caixa_suspensa_1（data） {
選擇_1
.on("change", function(d){
var value_1 = d3.select(this).property("value") 。
document.querySelector('#barra-de-texto-para-radar-1').value = value_1;
var value_1_2 = d3.select(this).property("market" />);
document.querySelector('#botao-de-jogo-betfair-1').action = value_1_2;
});
let update_1 = select_1.selectAll("option")
.data(data)。
update_1.exit（）.remove（）。
update_1.enter().append("option"/span>).merge(update_1)
.attr("value", d => d.value)
.attr("market", d => D.market)
.text(d => d.label) 。
}
d3.csv("Lista_de_Jogos. csv", function(data){caixa_suspensa_1(data)}) 。
</script>>
< form id="bootao-de-jogo-betfair-1" action="" target="_blank"/span>>
<input type="submit"/span> style="width: 100%;" value="Jogo Betfair 1"/>
</form>/span>
</div>/span>
</div>/span>
</body>
</html>
生成action="undefined"值的路徑是這樣的：
var value_1_2 = d3.select(this).property("market") 。
document.querySelector('#botao-de-jogo-betfair-1').action=value_1_2。
CSV檔案"Lista_de_Jogos.csv"是：
label, value,market
,,
酒店,巴士,聚會
房屋,汽車,作業
選擇框完美地顯示了兩種屬性：
< option value="car"/span> market="work"/span>> house</option>
但是，當我選擇這個<option>house，而不是#botao-de-jogo-betfair-1的action保持值work，他得到的值是undefined：
< form id="bootao-de-jogo-betfair-1" action="undefined" target="_blank">
<input type="submit"/span> style="width: 100%;" value="Jogo Betfair 1">
</form>/span>
注意：當我嘗試使用.property("value");回傳的值car非常完美。
uj5u.com熱心網友回復：
你正在從select標簽訪問market屬性，而不是從包含market屬性的選定的option標簽訪問。要解決這個問題，你只需要獲得已經選定的選項，然后使用attr獲得值。
var value_1_2 = d3.select(this. options[this.selectedIndex]).attr("market" )。
document.querySelector('#botao-de-jogo-betfair-1').action=value_1_2;
你可以做的另一個改進是，我們可以不搜索from，而是給出表單名稱，并使用該名稱從documemt訪問表單
。< form name="myform"/span> action=" method="post" id="formulario-radar-1">
...
</form> ...
然后在javascript中
var value_1_2 = d3. select(this.options[this.selectedIndex]).attr("market") 。
document.forms["myform"].action = value_1_2;
uj5u.com熱心網友回復：
為什么不在這里堅持使用D3呢？
var value_1_2 = d3.select(this).property("market") 。
d3.select('#botao-de-jogo-betfair-1').attr('action', value_1_2) 。
我認為在Element中沒有任何行動屬性。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/320660.html
標籤：
下一篇：d3疊加條形圖--條形圖無法呈現