après la valeur de la zone de texte chargée par défaut est indéfinie

Question

Ceci est étrange. Mon .val() et .html() est toujours indéfini bien que je l'utilise après que tout soit chargé sur la page. aussi, .text() est vide.

<div class="row col-md-12"> 
<div class="row col-md-12"> 
    <label id="lblDir" style="width:auto">Scripts Directory Path: <input type="text" id="txturl"></label> 
</div> 
<div class="row col-md-12"> 
    <div id="grid" style="border:dashed"></div> 
</div> 
<div class="row col-md-12"> 
    <input id="btnRun" type="button" value="Run Scripts" style="margin:5px" /> 
</div> 
<div class="row col-md-12"> 
    <label id="result"></label> 
</div> 
</div> 
<script> 
$(function() { 
    $("#btnRun").kendoButton(); 
    $("#btnRun").on("click", function (e) { 
     alert($('#txtUrl').text()); 
    }); 
}); 

choses que j'ai essayé 1. mettre balise script avant balise div 2. ajouter la fonction onclick dans le bouton html

<input id="btnRun" type="button" value="Run Scripts" onclick="onInstall();" style="margin:5px" /> 

résultat est le même

Answer 1

Vous devez conserver l'id dans le balisage HTML et la valeur d'id dans le script même. Et la valeur de l'identifiant est sensible à la casse.

Dans votre balisage html, l'identifiant du type d'entrée est "txturl" mais dans js il s'agit de "txtUrl". Faites à la fois "txturl" ou "txtUrl" et cela devrait fonctionner correctement.

Answer 2

Comme @Carsten Løvbo Andersen mentionné, vous devez utiliser $('#txturl').val() au lieu de $('#txtUrl').text() parce que:

• #txtUrl n'existe pas. Les sélecteurs CSS classes et jQuery sont souvent sensibles à la casse. (L'insensibilité à la casse n'est pas très bien prise en charge.)
• Les éléments input ne possèdent pas .text(), mais plutôt .val().

$(function() { 
 
    $("#btnRun").on("click", function (e) { 
 
     alert($('#txturl').val()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="row col-md-12"> 
 
<div class="row col-md-12"> 
 
    <label id="lblDir" style="width:auto">Scripts Directory Path: <input type="text" id="txturl"></label> 
 
</div> 
 
<div class="row col-md-12"> 
 
    <div id="grid" style="border:dashed"></div> 
 
</div> 
 
<div class="row col-md-12"> 
 
    <input id="btnRun" type="button" value="Run Scripts" style="margin:5px" /> 
 
</div> 
 
<div class="row col-md-12"> 
 
    <label id="result"></label> 
 
</div> 
 
</div>