如何在javascript中使用onclick获取'this'值?

时间:2016-08-11 08:57:16

标签: javascript jquery html

我这里有这个代码:

<div class="row">
            <p align="center" class="panel-body alert-info">* It is important to enter student data first rather than book</p>
            <form action="addbooks.php" method="post">

            <p align="center" class="panel-body alert-info">Choose the add type: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <input type="radio" id="bauthor" name="book" value="bauthor" onclick="booksclicked(this);">&nbsp;Author/Student&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <input type="radio" id="books" name="book" value="books" onclick="booksclicked(this);">&nbsp;Thesis&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <input type="radio" id="ref_books" name="book" value="ref_books" onclick="booksclicked(this);">&nbsp;References Books</p>

            <script>
            function booksclicked(){
                if (document.getElementById('bauthor').checked) {
                    //var ques1 = document.getElementById("dem").innerHTML;
                    document.getElementById("demu").innerHTML = "<p align='center'>*Fill the form(STUDENT)</p>"+
                    "<p><u>STUDENT FORM</u></p><br>"+
                    "<p>Student Matric Number"+
                    "<input type='text' class='form-control' name='addmatricno' id='addmatricno' placeholder='Enter student matric number' size='20px'><br><br>"+
                    "Student Name"+
                    "<input type='text' class='form-control' name='addname' id='addname' placeholder='Enter student name'><br><br>"+
                    "Student Programme"+
                    "<input type='text' class='form-control' name='addprogramme' id='addprogramme' placeholder='Enter student programme'><br><br>"+
                    "Student Education Level"+
                    "<select name='selectedulevel' id='selectedulevel' class='form-control'>"+
                    "<option selected disabled>Select education level</option>"+
                    "<option value='PHD'>PHD</option>"+
                    "<option value='MASTER'>MASTER</option>"+
                    "<option value='DEGREE'>DEGREE</option></p></select><br><br>"+
                    "<p align='center'><input type='submit' class='btn btn-primary' name='submitaddstudent' id='submitaddstudent' value='Add Student' style = 'width:'20%; text-align: center;' onclick='return saddstudent(this.id)'></p><br><br>";
                }

                <div id="demu" class="col-lg-12 col-xs-12 col-xs md-12 col-sm-12 text-left panel-body alert-info"></div>

正如您在最后一行代码中看到的那样,我的提交按钮是我放置onclick代码的。

然后在我的javascript上我喜欢这个

 function saddstudent(a){
        alert("fds");
        return false;
        /*  if(!a.addmatricno.value || !a.addname.value || !a.addprogramme.value || !a.selectedulevel.value){
                alert("PLease complete the student form");
                return false;
            }*/
}

它不仅没有传递数据,而且在点击时,它甚至没有转到这个功能。这很奇怪。是因为即时通讯使用innerHTML?或者这是我错过的东西

1 个答案:

答案 0 :(得分:1)

没有id="demu"的元素和If和{函数缺失的大括号booksclicked()

function saddstudent(a){
        alert("fds");
        return false;
}
function booksclicked(){
                if (document.getElementById('bauthor').checked) {
                    //var ques1 = document.getElementById("dem").innerHTML;
                    document.getElementById("demu").innerHTML = "<p align='center'>*Fill the form(STUDENT)</p>"+
    "<p><u>STUDENT FORM</u></p><br>"+
    "<p>Student Matric Number"+
    "<input type='text' class='form-control' name='addmatricno' id='addmatricno' placeholder='Enter student matric number' size='20px'><br><br>"+
    "Student Name"+
    "<input type='text' class='form-control' name='addname' id='addname' placeholder='Enter student name'><br><br>"+
    "Student Programme"+
    "<input type='text' class='form-control' name='addprogramme' id='addprogramme' placeholder='Enter student programme'><br><br>"+
    "Student Education Level"+
    "<select name='selectedulevel' id='selectedulevel' class='form-control'>"+
    "<option selected disabled>Select education level</option>"+
    "<option value='PHD'>PHD</option>"+
    "<option value='MASTER'>MASTER</option>"+
    "<option value='DEGREE'>DEGREE</option></p></select><br><br>"+
    "<p align='center'><input type='submit' class='btn btn-primary' name='submitaddstudent' id='submitaddstudent' value='Add Student' style = 'width:'20%; text-align: center;' onclick='return saddstudent(this)'></p><br><br>";
                  }
  }
<div class="row">
            <p align="center" class="panel-body alert-info">* It is important to enter student data first rather than book</p>
            <form action="addbooks.php" method="post">

            <p align="center" class="panel-body alert-info">Choose the add type: &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <input type="radio" id="bauthor" name="book" value="bauthor" onclick="booksclicked(this);">&nbsp;Author/Student&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <input type="radio" id="books" name="book" value="books" onclick="booksclicked(this);">&nbsp;Thesis&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <input type="radio" id="ref_books" name="book" value="ref_books" onclick="booksclicked(this);">&nbsp;References Books</p>
<div id="demu"></div>