Question

如何将人物的表单输入文本插入到预先制作的段落中。

例如：输入您的姓名：John

变为 <p>Hello, my name is John</p>

最好在相同或另一个HTML页面上。就像所有这些各种web生成器一样。

我可以访问的语言是HTML，jQuery，JavaScript和JSON

Answer 1

正如Rory McCrossan的评论中所述，使用.val()和.text()来实现此目标。

试试这个：

$('#btn').on('click', function() {
  $('#text').text('Hello, my name is ' + $('#nameInput').val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<label for="nameInput">Your Name:
  <input type="text" id='nameInput'>
</label>
<button id='btn'>Show Name</button>

<p id='text'></p>

Answer 2

在Jquery中：

$('#paragraphId').text(myText);

很难在没有更多代码发布的情况下向您提供更具体的建议，但只要您的段落具有ID并且您的文本存储在变量中，上述内容就可以使用。

Answer 3

这里是小提琴：https://jsfiddle.net/mt42fn3s/

<强> HTML

$( document ).ready(function() {
    $("#name").keyup(function() {
            var userName = $('#name').val();
            $('#result').html("Hello My name is " + userName);
    });
});

<强>的jQuery

function addContent(){
    var showBtn = Ti.UI.createButton({
        id: "showButton",
        title:"Show Text",
        top: 10,
    });
    var nameTi = Ti.UI.createTextField({
        id:"displayText",
        textFieldId: 'displayText',
        width: 50
    });
    showBtn.addEventListener("click", function(){
    alert(nameTi.text);
    alert($.index.nameTi);
   }
});
    $.index.add(nameTi);
    $.index.add(showBtn);
}
$.index.open();
addContent();

Answer 4

另一个可能的解决方案是将表单发布回当前页面（如果你能够使用php和表单）并从全局$ _POST变量中检索它们。

// index.php

<?php $name = $_POST['name']; ?>

// This is your predetermined paragraph, with the name dynamically inserted
<p>Hello, my name is <?php echo $name; ?></p>

<form action="index.php" method="post">
  <input id="name" name="name">
  <input type="submit" value="submit">
</form>

这样，为你的paragrah添加尽可能多的变量要容易得多。

如果您只能使用Javacsript / Jquery，可能会创建带有id标记的跨度来保存您的信息。例如;

<p>Hello, my name is <span id='name'></span></p>
<p>My surname is <span id='surname'></span></p>

// jquery

var $name = $('.name').val(); // your name input box;
var $surname = $('.surname').val(); //your surname input box

$('#name').val($name);
$('#surname').val($surname);

将输入的表单输入文本插入段落

4 个答案: