Javascript innerHTML Not Posting

Javascript innerHTML Not Posting

本文关键字：Posting Not innerHTML Javascript      更新时间：2023-09-26

我正试图获得一个函数来打印出用户在文本框中输入的任何内容。我使用onClick作为提交按钮上的属性。我知道我把它设置得很好，因为它会闪烁答案，但只是一瞬间。我如何才能让输入保持在页面上？这是代码：HTML：键入你想发布到网站上的内容！

HTML:

<div id="main_div">
<section id="leftbox">
<form name="mybox">
    Type what you want to post to the website!:
    <br />
    <input type="textbox" size="15" maxlength="15" name="text"     id="text">
    <br />
    <input type="submit" value="Submit!" onClick="doFirst()">
</form>
</section>
</div>
<div id="insert"></div>

Javascript：

function doFirst(){
    text = document.getElementById('text');
   insert = document.getElementById('insert');     
  if(text.value == "")
  { 
    insert.innerHTML = "Please input something!";
    return false; 
  }
  else
  { 
    insert.innerHTML = text.value; 
  } 
}

试试这个：使用类型=按钮

<input type="button" value="Submit!" onClick="doFirst()">

OR使用类型=提交

<form name="mybox" onsubmit="doFirst(); return false;">
    <input type="submit" value="Submit!">
</form>

解释：

已执行提交按钮DO中onclick的操作。您可以看到页面没有任何更改，因为有一个FORM。并且重点是：表单在JS函数doFirst()之后立即处理提交动作。在带有return false的表格中添加onsubmit以停止默认操作，意味着：

<form name="mybox" onsubmit="return false;">
    <input type="button" value="Submit!" onClick="doFirst()">
</form>

为了简化更改，在表单触发器中使用button而不是submit类型，或者使用onsubmit而不是onclick。

onClick="doFirst()"

被转换为匿名函数：

function(){ doFirst() }

无论该函数返回什么，都会决定提交是应该完成还是中止，因此您应该使用：

onClick="return doFirst();"

换句话说，doFirst返回一些东西是不够的，无论doFirst返回什么，都应该在onClick中再次返回。

相关文章：