Question

我用一些值创建了一个选择选项，例如：

function updateinput(e) {
var selectedOption = e.options[e.selectedIndex];
document.getElementById('data1').value = selectedOption.getAttribute('data1');
document.getElementById('data2').value = selectedOption.getAttribute('data2');
document.getElementById('data3').value = selectedOption.getAttribute('data3');
document.getElementById('data4').value = selectedOption.getAttribute('data4');
document.getElementById('data5').value = selectedOption.getAttribute('data5');
document.getElementById('data-url').setAttribute('href', 'http://google.com');  
document.getElementById('data-url').setAttribute('href', 'http://yahoo.com'); 
}

<select>
<option data1='1.000.000' data2='0,-' data3='0,-' data4='0,-' data5='1.000.000' data-url='http://google.com'>30 Day</option>
<option data1='1.500.000' data2='500.000,-' data3='0,-' data4='0,-' data5='2.000.000' data-url='http://yahoo.com'>60 Day</option>
</select>


<input id="data1" name="data1" readonly type="text">
<input id="data2" name="data2" readonly type="text">
<input id="data3" name="data3" readonly type="text">
<input id="data4" name="data4" readonly type="text">
<input id="data5" name="data5" readonly type="text">
<a id="data-url" name="data-url">Anchor</a>

如果我选择选项 60 ，则显示的网址是相同的：http://google.com

应该出现的是yahoo.com，但我对如何显示或从相同的document.getElementById和setAttribute获得不同的URL感到困惑。

Answer 1

您可以读取url值，然后相应地添加href属性。我不确定这是否是您想要的。看看！

function updateinput(e) {
 
   

 var selectedOption = e.target.options[e.target.selectedIndex];
       var url = selectedOption.getAttribute('data-url');
var name = selectedOption.getAttribute('data-url-name');
    document.getElementById('data1').value = selectedOption.getAttribute('data1');
    document.getElementById('data2').value = selectedOption.getAttribute('data2');
    document.getElementById('data3').value = selectedOption.getAttribute('data3');
    document.getElementById('data4').value = selectedOption.getAttribute('data4');
    document.getElementById('data5').value = selectedOption.getAttribute('data5');
    document.getElementById('data-url').setAttribute('href', url);
      document.getElementById('data-url').innerHTML=name;
    }

    <select onChange="updateinput(event)">
    <option data1='1.000.000' data2='0,-' data3='0,-' data4='0,-' data5='1.000.000' data-url='http://google.com' data-url-name='Google'>30 Day</option>
    <option data1='1.500.000' data2='500.000,-' data3='0,-' data4='0,-' data5='2.000.000' data-url='http://yahoo.com' data-url-name='Yahoo'>60 Day</option>
    </select>


    <input id="data1" name="data1" readonly type="text">
    <input id="data2" name="data2" readonly type="text">
    <input id="data3" name="data3" readonly type="text">
    <input id="data4" name="data4" readonly type="text">
    <input id="data5" name="data5" readonly type="text">
    <a id="data-url" name="data-url">Anchor</a>

从document.getElementById .setAttribute href获取不同的URL

1 个答案: