zur Eingabe von Textwert in jquery

Question

bekommen möchte ich Eingabetext Wert bekommen, wenn ich einen Wert in Eingabetext einfügen

und wenn ich ADD IN BOOK LIST Taste jquery klicken in Bücherliste ul-Tag anhängen wird

HTML-Code

<form action="" method="POST"> 
    {% csrf_token %} 
    <p>POST TITLE</p> 
    <input type="text" name="title" placeholder="Insert title" required> 

    <p>INSERT BOOK NAME</p> 
    //user will input value this text box 
    <input type="text" name="bookname" placeholder="book name"> 

    <input type='button' name="addlist" value="ADD IN BOOK LIST"> 

    <ul class="booklist"> 
    </ul> 

    <input type="submit" id='button'>//create post button 

</form> 

ich entscheiden val() Methode zu verwenden, und ich mit testen alert()

Code

js

(function(){ 
    //get ADD IN BOOK LIST button 
    //get bookname tagname 
    var addlist_button = $('input[name=addlist]'); 
    var book_name = $('input[name=bookname]').val(); 

    addlist_button.on('click', function(event){ 
    if((book_name == "")||(book_name == null)){ 
     alert('fail'); 
    } 
    else{ 
    alert(book_name); 
    } 
    }); 
})(); 

aber jquery nicht Textwert

die val() Methode erhalten, ist nur value="" in Tag-Inline bekommen .. aber es ist nutzlos Wert

ich Kunden wollen wertvoller Text bitte jemand mir helfen

Answer 1

Das Problem ist, dass Sie den Wert der Eingabe beim Laden der Seite überprüfen, aber nicht, wenn der Benutzer cl Eckt auf den Knopf.

Also die Lösung ist es zu überprüfen, wenn der Benutzer auf die Schaltfläche klickt.

(function(){ 
 
    //get ADD IN BOOK LIST button 
 
    //get bookname tagname 
 

 
var addlist_button = $('input[name=addlist]'); 
 
    addlist_button.on('click', function(event){ 
 
    
 
    var book_name = $('input[name=bookname]').val(); 
 
    if((book_name == "")||(book_name == null)){ 
 
     alert('fail'); 
 
    } 
 
    else{ 
 
     alert(book_name); 
 
    } 
 
    }); 
 
})();

<form action="" method="POST"> 
 
<script src="https://code.jquery.com/jquery-3.0.0.js"></script> 
 
    <p>POST TITLE</p> 
 
    <input type="text" name="title" placeholder="Insert title" required> 
 

 
    <p>INSERT BOOK NAME</p> 
 
    //user will input value this text box 
 
    <input type="text" name="bookname" placeholder="book name"> 
 

 
    <input type='button' name="addlist" value="ADD IN BOOK LIST"> 
 

 
    <ul class="booklist"> 
 
    </ul> 
 

 
    <input type="submit" id='button'>//create post button 
 

 
</form>

http://jsbin.com/niheqo/edit?html,js

Answer 2

Eingangswert in Click-Ereignis Get wie folgt:

(function(){ 
    //get ADD IN BOOK LIST button 
    //get bookname tagname 
    var addlist_button = $('input[name=addlist]'); 


    addlist_button.on('click', function(event){ 
    var book_name = $('input[name=bookname]').val(); 

    if((book_name == "")||(book_name == null)){ 
     alert('fail'); 
    } 
    else{ 
    alert(book_name); 
    } 
    }); 
})(); 

Answer 3

Dies liegt daran, Sie book_name definiert haben, bevor das Ereignis ausgelöst wurde und zu diesem Zeitpunkt es war gleich "".

(function(){ 
    //get ADD IN BOOK LIST button 
    //get bookname tagname 
    var addlist_button = $('input[name=addlist]'); 


    addlist_button.on('click', function(event){ 
    var book_name = $('input[name=bookname]').val(); 

    if((book_name == "")||(book_name == null)){ 
     alert('fail'); 
    } 
    else{ 
    alert(book_name); 
    } 
    }); 
})();