Question

点击“提交”按钮后，我需要在网页上刷新<myDiv>。

我创造了一个我需要的例子。我想在单击“提交”按钮时在<myDiv>内显示用户输入文本。目前它没有显示任何内容。我怎样才能解决这个问题？

http://jsfiddle.net/NathaliaZeed/8dn5j/2/

谢谢大家。

Answer 1

您的示例中的代码很好，除了您忘记加载jQuery库。如果你确定包含jQuery，javascript代码应该可以工作。

此外，您的示例应该在PHP服务器上运行。 JSfiddle不解释PHP代码，因此这也是该示例不起作用的原因。如果您没有PHP服务器，Google for WAMP for Windows或MAMP for Mac。

Answer 2

您需要使用完成：未完成：，然后将您的val1变量分配给myDiv 工作小提琴：http://jsfiddle.net/8dn5j/14/

见下文：

$('#btn').click(function(e) {   
    var val1 = $('#val1').val();    
    e.preventDefault();
    $.ajax({
        type: 'post',                
        data: {'val1':val1},                    
        complete: function(jqXHR, textStatus){
            $("#myDiv").html(val1);
        }
    });
});

Answer 3

不确定为什么你需要php和ajax，如果只需要点击按钮点击div而不进行任何服务器端处理，你需要描述这个代码将会起作用

<div class="myDiv" id="myDiv"></div>

<div class="sear">
     <form action="" method="post">
     Search Word:    <br />     
         <input type="text" name="val1" id="val1" /><br />
         <input type="button" value="Submit" id="btn" />
        </form>
      </div>

的js

$('#btn').click(function(e) {   
        var val1 = $('#val1').val();    
            $("#myDiv").html(val1);
             $("#myDiv").toggle("slow");
        });

Answer 4

顺便说一句，您不需要使用表单标签..

我会这样做：

$('#btn').click(function(e) {   
var val1 = $('#val1').val();    

        $.ajax({
            type: 'post',                
            data: {val1:val1},                    
        success: function(data) { 
                $("#myDiv").text(data);
            }
        });

    });

Answer 5

对我而言，它不会对Ajax请求做任何事情。

 $('#btn').click(function(e) {  e.preventDefault();

 $("#myDiv").html($('#val1').val());   

 //..ajax stuff..

 });

在没有页面刷新的情况下在提交时更新DIV

5 个答案: