阻止刷新页面发射功能

我一直在负责构建一个非常简单的应用程序，已在2行一系列的下拉列表中后，当选择2，一个简单的功能地连接了2个值，并给出一个输出旁边，像这样：阻止刷新页面发射功能

dropdown1 dropdown2 Output

我想要得到的是，一旦第二个下拉值选择功能运行并显示它说：output输出。但目前，似乎发生的是输出显示在新窗口中。

这里是我到目前为止（HTML）：

<form> 
<select id="test"> 
<option>Arena/Quantum Barcelona LTBC</option> 
<option>Arena/Quantum Spain LTES</option> 
</select> 

<select id="name" onchange="tryThis()"> 
<option>Name</option> 
<option>Name1</option> 
</select> 

</form>

的JavaScript：

function tryThis() { 

var string, string1 = ''; 

var e = document.getElementById("test"); 
string = e.options[e.selectedIndex].text; 

var a = document.getElementById("name"); 
string1 = a.options[a.selectedIndex].text; 
document.write(string+'_'+string1); 
}

我是不是做比它需要这个比较难？

来源

2011-12-20 zik

要么创建一个新的元素，要么设置一个现有元素的内容; 'document.write'会消灭你的页面。我建议使用JS库来使所有这些更容易。 – 2011-12-20 12:14:03

这是因为document.write清除页面显示的东西了。你永远不需要使用该功能。

取而代之，您可以将其附加到例如正文：

document.body.appendChild(
    document.createTextNode(string + '_' + string2) 
);

来源

2011-12-20 12:12:41 pimvdb

真棒谢谢你！ – zik 2011-12-20 12:16:15

你有没有注意到，你的JS函数调用tryThis()和事件处理你打电话tryThsis()

然而，在你的情况我会使用document.write避免，良好的替代品追加到身体或具有DIV并改变DIV

来源

2011-12-20 12:13:19

对不起，我意识到，那只是我愚蠢，但我现在纠正这个:) – zik 2011-12-20 12:15:38

的innerHTML首先把一个ID的形式，使其更易于访问。

var a = (function() { 
    var myForm = document.getElementById("myForm"), 
     magic = function() { 
      var a = myForm.getElementsByTagName("select"), 
       b, 
       c = []; 
      for (b = a.length - 1; b > -1; b -= 1) { 
       c.push(a[b].value); 
      } 
      alert(c.join(" ") + " output"); 
     }; 
    myForm.onclick = magic; 
}());

你不是具体以什么额外的“输出”应该是或你想怎么传回的数据，但是在这里你去。您可以将结果推送到不同的表单元素的值中，而不是使用警报。不要使用document.write，因为这不能推迟。如果您尝试推迟document.write操作，它将替换当前页面的全部正文内容。

来源

2011-12-20 12:16:28 austincheney

阻止刷新页面发射功能

回答

相关问题