即使我填满了田地，我的验证仍然会给我一个提醒

时间：2015-11-19 15:42:10

标签： javascript html html5

我有一个这样的表格：

<form id="formDaftar" onsubmit="return daftarClick()" method="post">
<table id="tableFormDaftar" border="0" width="400px" height="300px">
<tr>
<td>Nama</td>
<td><input type="text" name="nama" id="nama" size="39"/></td>
</tr>

<tr>
<td>Alamat</td>
<td><textarea cols="40" rows="4" name="alamat" id="alamat">
</textarea></td>
</tr>
<tr>
<td>Tempat/Tanggal Lahir</td>
<td><input name="tempatLahir" id="tempatLahir" size="39" type="text"/></td>
</tr>

<tr>
<td>Jenis Kelamin</td>
<td><input type="radio" id="radio1" name="gender" id="gender1"/>Laki-laki
    <input type="radio" id="radio1" name="gender" id="gender2"/>Perempuan
</td>
</tr>

<tr>
<td>Pekerjaan</td>
<td><input name="pekerjaan" id="pekerjaan" size="39"/></td>
</tr>

<tr>
<td>Status</td>
<td>
<select id="status" name="status">
<option selected="selected">Lajang</option>
<option>Menikah</option>
<option>Duda</option>
<option>Janda</option>
</select></td>
</tr>

<tr>
<td>Agama</td>
<td><select id="agama" name="agama">
<option>Islam</option>
<option selected="selected">Kristen</option>
<option>Katholik</option>
<option>Budha</option>
<option>Hindu</option>
</select></td>
</tr>
<tr>
<td>Kewarganegaraan</td>
<td><select id="kwn">
<option selected="selected">Indonesia</option>
<option>Asing</option>
</select></td>
</tr>
<tr>
<td colspan="2" id="colbutton"> <button name="masukkan" type="submit" id="masukkan">Masukkan</button> <button type="reset" name="batalkan" id="batalkan">Batalkan</button></td>
</tr>
</table></form>

我有一个这样的脚本：

var nama = document.getElementById("nama").value;
var alamat = document.getElementById("alamat").value;
var tempatLahir = document.getElementById("tempatLahir").value;
var gender;

if (document.getElementById("gender1").checked){
    gender = document.getElementById("gender1").value;
}
else if (document.getElementById("gender2").checked){
    gender = document.getElementById("gender2").value;
}

var a = document.getElementById("agama");
var agama = a.options[a.selectedIndex].text;

var pekerjaan = document.getElementById("pekerjaan").value;

var b = document.getElementById("status");
var status = b.options[b.selectedIndex].text;

var c = document.getElementById("kwn");
var kwn = c.options[c.selectedIndex].text;

function daftarClick(){

    if (nama == ""){
        alert("Nama harus diisi!"); 
        return false;
    }
    else if (alamat == ""){
        alert("Alamat harus diisi!");
        return false;
    }
    else if (tempatLahir == ""){
        alert("Tempat/Tanggal Lahir harus diisi!");
        return false;
    }
    else if(!document.getElementById("gender1").checked && !document.getElementById("gender2").checked){
        alert("Jenis Kelamin harus dipilih!");
        return false;
    }

}

问题在于，即使我填写了字段，它仍然显示alert()说我需要填写字段。

我已经设置了验证，如果用户没有在字段中输入任何字母，则会显示警告，但无论我在字段中放置什么，它都会说我还没有把它放在那里。我在这里弄错了什么？

It says I need to fill the form I have already filled

3 个答案:

答案 0 :(得分：1)

试试这个：

<script type="text/javascript">


function daftarClick(){

    var nama = document.getElementById("nama").value;
    var alamat = document.getElementById("alamat").value;
    var tempatLahir = document.getElementById("tempatLahir").value;
    var gender;

    if (document.getElementById("gender1").checked){
        gender = document.getElementById("gender1").value;
    }
    else if (document.getElementById("gender2").checked){
        gender = document.getElementById("gender2").value;
    }

    var a = document.getElementById("agama");
    var agama = a.options[a.selectedIndex].text;

    var pekerjaan = document.getElementById("pekerjaan").value;

    var b = document.getElementById("status");
    var status = b.options[b.selectedIndex].text;

    var c = document.getElementById("kwn");
    var kwn = c.options[c.selectedIndex].text;




    if (nama == ""){
        alert("Nama harus diisi!"); 
        return false;
    }
    else if (alamat == ""){
        alert("Alamat harus diisi!");
        return false;
    }
    else if (tempatLahir == ""){
        alert("Tempat/Tanggal Lahir harus diisi!");
        return false;
    }
    else if(!document.getElementById("gender1").checked && !document.getElementById("gender2").checked){
        alert("Jenis Kelamin harus dipilih!");
        return false;
    }

}
</script>

编辑： HTML中的复选框有多个id属性，这是一个错误，因此document.getElementById找不到它们。

<form id="formDaftar" onsubmit="return daftarClick()" method="post">
<table id="tableFormDaftar" border="0" width="400px" height="300px">
<tr>
<td>Nama</td>
<td><input type="text" name="nama" id="nama" size="39"/></td>
</tr>

<tr>
<td>Alamat</td>
<td><textarea cols="40" rows="4" name="alamat" id="alamat">
</textarea></td>
</tr>
<tr>
<td>Tempat/Tanggal Lahir</td>
<td><input name="tempatLahir" id="tempatLahir" size="39" type="text"/></td>
</tr>

<tr>
<td>Jenis Kelamin</td>
<!-- Fix is here, id="radio1" removed from both -->
<td><input type="radio" name="gender" id="gender1"/>Laki-laki
    <input type="radio" name="gender" id="gender2"/>Perempuan        
</td>
</tr>

<tr>
<td>Pekerjaan</td>
<td><input name="pekerjaan" id="pekerjaan" size="39"/></td>
</tr>

<tr>
<td>Status</td>
<td>
<select id="status" name="status">
<option selected="selected">Lajang</option>
<option>Menikah</option>
<option>Duda</option>
<option>Janda</option>
</select></td>
</tr>

<tr>
<td>Agama</td>
<td><select id="agama" name="agama">
<option>Islam</option>
<option selected="selected">Kristen</option>
<option>Katholik</option>
<option>Budha</option>
<option>Hindu</option>
</select></td>
</tr>
<tr>
<td>Kewarganegaraan</td>
<td><select id="kwn">
<option selected="selected">Indonesia</option>
<option>Asing</option>
</select></td>
</tr>
<tr>
<td colspan="2" id="colbutton"> <button name="masukkan" type="submit" id="masukkan">Masukkan</button> <button type="reset" name="batalkan" id="batalkan">Batalkan</button></td>
</tr>
</table></form>

答案 1 :(得分：1)

这是因为您的变量是在页面加载时声明的，因此您的输入为空，变量为空值

将其更改为

var makescrollbottom = function(){
    $("div.media").scrollTop($("div.media").prop("scrollHeight"));
}
makescrollbottom();

答案 2 :(得分：0)

检查这个我认为它正如你所期待的那样工作

https://jsbin.com/ragoces/edit?html,js,output 

var nama = document.getElementById("nama");
var alamat = document.getElementById("alamat");
var tempatLahir = document.getElementById("tempatLahir");
var gender;

if (document.getElementById("gender1").checked){
    gender = document.getElementById("gender1").value;
}
else if (document.getElementById("gender2").checked){
    gender = document.getElementById("gender2").value;
}

var a = document.getElementById("agama");
var agama = a.options[a.selectedIndex].text;

var pekerjaan = document.getElementById("pekerjaan").value;

var b = document.getElementById("status");
var status = b.options[b.selectedIndex].text;

var c = document.getElementById("kwn");
var kwn = c.options[c.selectedIndex].text;


function daftarClick(){

if (nama.value === ""){
    alert("Nama harus diisi!"); 
    return false;
}
else if (alamat.value === ""){
    alert("Alamat harus diisi!");
    return false;
}
else if (tempatLahir.value === ""){
    alert("Tempat/Tanggal Lahir harus diisi!");
    return false;
}
else if(!document.getElementById("gender1").checked &&           !document.getElementById("gender2").checked){
alert("Jenis Kelamin harus dipilih!");
return false;
 }

}
相关问题
最新问题