选择特定的跨度来显示用户输入

我有这个代码，它动态地创建一个按钮的按钮。在创建的div中，将要求用户输入并提交。提交时，它会显示在同一个div中的输入，然后创建另一个div来执行相同的操作。显示的值应该保留在每个div中，每个div应该只显示它的相关输入。选择特定的跨度来显示用户输入

var i=1; 
$(document).ready(function(){  
    $("#addCase").submit(function(event) { 
    event.preventDefault(); 
    //adding div 
    var idName ="Div_num_"+i; 
     $('.newValue').show(); 
     $('<div />').attr({ 
      'id' : idName  
      }).appendTo('#container').load("content.php", function() { 
       $('<h3>'+idName+'</h3>').prependTo($(this));  
      }); 
     i++; 
    //showing input 
     var $form = $("#addCase"), 
     url = $form.attr("action"),  
     textInserted=$("#name").val();  
     $.post(url,function(){ 
     $(".insertedText").append(textInserted); 
     }); 
     $("#inputText").remove(); 
    }); 
});

HTML：

<form id="addCase" method="post" action=""> 
    <div id="container"></div> 
    <input id="addNew" type="submit" value="Add Case">   
</form>

content.php

<div id="inputText"><p>Text :<input name="name" id="name" type="text"/></p></div> 
<div style="display:none;" class="newValue"><p> Inserted Text :<span class="insertedText"></span></p></div>

我不知道如何选择相关的跨度，因此，只有插入新值只会显示在它的地点。

有人可以告诉我如何做到这一点。预先感谢您的任何帮助。

例如。第一输入= A，第二输入= B ，现在的结果是： DIV＃1节目AB和DIV＃2节目乙，结果应该是： DIV＃1节目A和DIV＃2节目乙

来源

2012-12-31 Free Soul

我不知道如果我理解你的问题完全是，但如果你想显示输入的文本，没有别的，只是将append（）更改为html（），它会将相应元素的内容设置为您在参数中提供的内容，并将删除该元素内的所有其他内容。 – SISYN

我很抱歉不清楚。在点击按钮上动态创建div。在创建的每个div中都会要求用户输入，当插入和提交一个值时，会创建另一个div，并且应该在前一个div中显示新值。问题是：插入的值将添加到每个创建div（例如，输入1 +输入2在div＃1，输入2在div＃2），而实际上我只想显示每个div的每个跨度的每个值。（例如div＃1中的input1，div＃2中的input2）。 –

使用html()代替append()，如果需要，只显示插入值...

html()用于设置元素的含量，这是该元素中的任何内容被新的内容被完全取代

append()刀片内容，由参数指定给e nd在匹配元素集合中的每个元素。

.... 
$.post(url,function(){ 
    $(".insertedText").html(textInserted);   //here 
});

....

修订

var i=1; 
$(document).ready(function(){  
$("#addCase").submit(function(event) { 
event.preventDefault(); 
//adding div 
var idName ="Div_num_"+i; 
    $('.newValue').show(); 
    $('<div />').attr({ 
     'id' : idName  
     }).appendTo('#container').load("content.php", function() { 
      $('<h3>'+idName+'</h3>').prependTo($(this));  
     }); 

//showing input 
    var $form = $("#addCase"), 
    url = $form.attr("action"),  
    textInserted=$("#name").val();  
    $.post(url,function(){ 
    $("#"+ idName).find(".insertedText").html(textInserted); //updated here 
    }); 
    $("#inputText").remove(); 
    i++; //increment to the end 
}); 
});

来源

2012-12-31 05:24:07 bipen

感谢您的建议，但我需要显示创建的每个div中插入的每个值。 –

我编辑了我的问题，并用您的建议，创建的每个div中的所有值均由新输入替换。我需要每个值保留在每个div中。 –

更新了我的答案....检查出它。 – bipen

选择特定的跨度来显示用户输入

回答

相关问题