为什么我无法在这里更改id demo的内部HTML？

时间：2016-07-22 09:13:30

标签： javascript html 

<p id="demo"></p>
<form name="names" action="" method="POST" onsubmit="getinputs(document.getElementByName(firstname),document.getElementByName(secondname))">
  Your name:<br>
  <input type="text" name="firstname"><br>
  Your crush's name:<br>
  <input type="text" name="secondname">
  <input type="submit" value="Submit">
  <br>
</form>


<script>
function getinputs(one, two)
{
document.getElementById('demo').innerHTML=one+two;
}
</script>

我应该如何更改它以使其工作直观？ 我想通过表单传递两个值。

5 个答案:

答案 0 :(得分：2)

按ID获取元素并阻止表单提交。见下文：

＆＃13;
＆＃13; 
07-22 12:07:46.631: E/AndroidRuntime(14441): FATAL EXCEPTION: main
07-22 12:07:46.631: E/AndroidRuntime(14441): Process: my1.app, PID: 14441
07-22 12:07:46.631: E/AndroidRuntime(14441): java.lang.RuntimeException: Unable to instantiate activity ComponentInfo{my1.app/my1.app.MainActivity}: java.lang.ClassNotFoundException: Didn't find class "my1.app.MainActivity" on path: DexPathList[[zip file "/data/app/my1.app-1/base.apk"],nativeLibraryDirectories=[/data/app/my1.app-1/lib/arm, /vendor/lib, /system/lib]]
07-22 12:07:46.631: E/AndroidRuntime(14441):    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2327)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2476)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at android.app.ActivityThread.-wrap11(ActivityThread.java)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1344)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at android.os.Handler.dispatchMessage(Handler.java:102)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at android.os.Looper.loop(Looper.java:148)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at android.app.ActivityThread.main(ActivityThread.java:5417)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at java.lang.reflect.Method.invoke(Native Method)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
07-22 12:07:46.631: E/AndroidRuntime(14441): Caused by: java.lang.ClassNotFoundException: Didn't find class "my1.app.MainActivity" on path: DexPathList[[zip file "/data/app/my1.app-1/base.apk"],nativeLibraryDirectories=[/data/app/my1.app-1/lib/arm, /vendor/lib, /system/lib]]
07-22 12:07:46.631: E/AndroidRuntime(14441):    at dalvik.system.BaseDexClassLoader.findClass(BaseDexClassLoader.java:56)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at java.lang.ClassLoader.loadClass(ClassLoader.java:511)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at java.lang.ClassLoader.loadClass(ClassLoader.java:469)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at android.app.Instrumentation.newActivity(Instrumentation.java:1067)
07-22 12:07:46.631: E/AndroidRuntime(14441):    at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2317)
07-22 12:07:46.631: E/AndroidRuntime(14441):    ... 9 more
07-22 12:07:46.631: E/AndroidRuntime(14441):    Suppressed: java.lang.NoClassDefFoundError: my1.app.MainActivity
07-22 12:07:46.631: E/AndroidRuntime(14441):        at dalvik.system.DexFile.defineClassNative(Native Method)
07-22 12:07:46.631: E/AndroidRuntime(14441):        at dalvik.system.DexFile.defineClass(DexFile.java:226)
07-22 12:07:46.631: E/AndroidRuntime(14441):        at dalvik.system.DexFile.loadClassBinaryName(DexFile.java:219)
07-22 12:07:46.631: E/AndroidRuntime(14441):        at dalvik.system.DexPathList.findClass(DexPathList.java:338)
07-22 12:07:46.631: E/AndroidRuntime(14441):        at dalvik.system.BaseDexClassLoader.findClass(BaseDexClassLoader.java:54)
07-22 12:07:46.631: E/AndroidRuntime(14441):        ... 13 more
07-22 12:07:46.631: E/AndroidRuntime(14441):    Suppressed: java.lang.ClassNotFoundException: my1.app.MainActivity
07-22 12:07:46.631: E/AndroidRuntime(14441):        at java.lang.Class.classForName(Native Method)
07-22 12:07:46.631: E/AndroidRuntime(14441):        at java.lang.BootClassLoader.findClass(ClassLoader.java:781)
07-22 12:07:46.631: E/AndroidRuntime(14441):        at java.lang.BootClassLoader.loadClass(ClassLoader.java:841)
07-22 12:07:46.631: E/AndroidRuntime(14441):        at java.lang.ClassLoader.loadClass(ClassLoader.java:504)
07-22 12:07:46.631: E/AndroidRuntime(14441):        ... 12 more
07-22 12:07:46.631: E/AndroidRuntime(14441):    Caused by: java.lang.NoClassDefFoundError: Class not found using the boot class loader; no stack trace available
＆＃13; 
function getinputs(one, two) {
    event.preventDefault();
    document.getElementById('demo').innerHTML=one+two;
}
＆＃13;
＆＃13;
＆＃13;

https://jsfiddle.net/qL0m7px2/

答案 1 :(得分：1)

这种方法不会等待脚本在表单提交时执行，并且表单将被提交。如果要在提交表单时执行js代码，则需要创建foll。变化

<form name="names" action="" method="POST" onsubmit="return getinputs(document.getElementByName(firstname),document.getElementByName(secondname))">

----
----

</form>

然后是剧本：

<script>
function getinputs(one, two)
{
document.getElementById('demo').innerHTML=one+two;
return false;
}
</script>

答案 2 :(得分：1)

我用

替换你的代码 
function getinputs() {
   var form = document.querySelector('#form-id');
   document.querySelector('#demo').innerHTML =
       form.firstname.value + form.secondname.value;
}

答案 3 :(得分：1)

试试这个，希望它会有所帮助。

<html>
<body>
<form name="names" action="" method="POST" onsubmit="return getinputs()">
  Your name:<br>
  <input type="text" id="firstname"><br>
  Your crush's name:<br>
  <input type="text" id="secondname">
  <input type="submit" value="Submit">
  <br>
</form>


<script>
function getinputs()
{
var one=document.getElementById("firstname");
var two=document.getElementById("secondname");

document.getElementById("demo").innerHTML=one.value+two.value;
return false;
}
</script>
<p id="demo" ></p>
</body>
</html>

答案 4 :(得分：0)

您需要进行以下更改

  • getElementByName 应为 getElementsByName

  • <强> document.getElementsByName（ '姓名'）[0]。价值 

    <script>
function getinputs(one, two)
{   
    event.preventDefault();
document.getElementById('demo').innerHTML=one+ " " + two;
}
</script>

<p id="demo"></p>
<form name="names" action="" method="POST" onSubmit="getinputs(document.getElementsByName('firstname')[0].value, document.getElementsByName('secondname')[0].value)">
  Your name:<br>
  <input type="text" name="firstname"><br>
  Your crush's name:<br>
  <input type="text" name="secondname">
  <input type="submit" value="Submit">
  <br>
</form>
相关问题
最新问题