Question

在这里处理一个简单的问题。最后，项目将采用用户提交的名称并将前两个字母大写。

但是现在我只想将用户的输入存储在变量中，然后以“结果”形式显示完全相同的内容。不知道我哪里出错了。

JSFiddle：http://jsfiddle.net/Ever/DQn57/

HTML：

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript"     
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js">   
</script>
    <link type="text/css" rel="stylesheet" href="stylesheet.css"/>
    <script src="application.js"></script>
    <title>Tim's Name Capitalizer!</title>
</head>
<body>
    <h2>Name Capitalizer</h2>

    <div class="intro">
    Welcome! Enter your name below (first and last) then press "SUBMIT" to see 
what happen!
    <br>
    </div>

    <br>    

    <form>
    Enter Here:
    <br>
    <input type="text" name="name" id="enteredFormName" placeholder="Your 
Name">
    </form>
    <br>

    <form>
    Result:
    <br>
    <input type="text" name="fixName" id="fixedFormName" placeholder="Your  
Name">
    </form>
    <br>
    <button>Submit</button>
</body>
</html>

CSS：

div.intro{
font-weight: bold;
width: 50%;
}

form.questions{
text-align: left;
font-size: 25px;
width: 500px;
height: 100px;
border: 1px solid black;
padding: 5px;
}

JS：

$(document).ready(function(){ 

     //when the <submit> button is clicked
     $('button').click(function(){

     //store the user's entry in a variable
     var enteredName = document.getElementById('enteredFormName').value;

     //update the html in the second form to show the user's entered name
     $('#fixedFormName').value(enteredName);
    });
}

Answer 1

http://jsfiddle.net/dwebexperts/U68ny/2/

替换它：

$(document).ready(function(){ 

     //when the <submit> button is clicked
     $('button').click(function(){

     //store the user's entry in a variable
     var enteredName = document.getElementById('enteredFormName').value;

     //update the html in the second form to show the user's entered name
     $('#fixedFormName').value(enteredName);
    });
}

用这个： -

$(document).ready(function(){ 

         //when the <submit> button is clicked
         $('button').click(function(){

         //store the user's entry in a variable
         var enteredName = document.getElementById('enteredFormName').value;
         //OR var enteredName = $('#enteredFormName').val();
         //update the html in the second form to show the user's entered name
         $('#fixedFormName').val(enteredName);
        });
    });

在" $(document).ready(function(){ "结束时您也遇到问题，您只能使用}关闭它，而最后需要});。

Answer 2

为什么要将普通的js与jquery混合使用？

 var enteredName = $('#enteredFormName').val();    
 $('#fixedFormName').val(enteredName);

Answer 3

试试这个

$(function(){
    $("button").click(function(){
         var data = $("#enteredFormName").val();
         $("#fixedFormName").val(data);
    });
})

Answer 4

使用jQuery我的朋友。

$(document).ready(function(){ 

    //when the <submit> button is clicked

    $( "button" ).click(function() {

             //store the user's entry in a variable
             var enteredName = $('#enteredFormName').val();

             //update the html in the second form to show the user's entered name
             $('#fixedFormName').val(enteredName);
    });

});

Answer 5

试试这个：

Jquery：

$(document).ready(function(){ 
$('#button').click(function(){
      var enteredName = document.getElementById('enteredFormName').value.toUpperCase();
$('#fixedFormName').val(enteredName)
        });
    });

演示：

http://jsfiddle.net/C9gGq/

在提交时，将表单值存储在变量中，然后以第二种形式显示它

5 个答案: