【问题标题】:.Ajax, .text Input display function.Ajax, .text 输入显示功能
【发布时间】:2014-10-01 03:06:03
【问题描述】:
var log = document.getElementById("log");


$(function(){
    $('textarea').keypress(function(e) {
        if (e.keyCode == 13 && !e.shiftKey) {

            log.innerHTML += "Company<br>";

            e.preventDefault();
            var frm = this.form; // don't submit the form yet

            log.innerHTML += "<br>";

            $.ajax({
                url: $(frm).attr('action'), // remember to specify which attribute you want
                data: $(frm).serialize(),
                dataType: "json",
                success: function() { 

                    log.innerHTML += "Ajax complete (form should be submitted now)<br>";

                    // submit the form when the ajax request is complete
                    // frm.submit();
                }
            });
        }
    });

});

<form action="#">
    <textarea name="comment"></textarea>
</form>

<div id="log"></div>

我正在尝试将脚本设置为可以在输入中显示结果的位置。有没有办法显示用户在下面的文本区域中输入的任何结果?

log.innerHTML += "Company<br>";

.innerHTML 看起来就像一段基本的文本。我所需要的只是能够显示一个链接列表,这些链接将被放入输入中以保存它们。有没有办法可以将 .text() 用于文本区域?

感谢您的帮助,谢谢!

【问题讨论】:

    标签: php html css ajax


    【解决方案1】:

    HTML:

    <form action="#">
        <textarea name="comment"></textarea>
    </form>
    
    <div id="log"></div>
    

    JS:

    $('textarea').on('focusout', function(){
      $('#log').text($(this).val());
    });
    

    【讨论】:

      【解决方案2】:

      使用$("#log").text("").append($("textarea").val());

      【讨论】:

      • .append 似乎只显示括号内的内容。有没有办法以相同的方式连接文本区域以显示用户在文本区域中输入的任何内容?
      • 刚刚更新了我的答案以获得我相信你想要得到的结果。这将每次清除文本并附加新文本。如果您希望它每次都添加,您可以删除 text("") 函数
      • 太棒了,谢谢!这就是我想要的。我只有 1 个问题,我已经完成了。 $("#log").append($("textarea").val());我正在这样使用它。这段代码正在做我想做的事。我每次都会添加,那么如何用

        拆分条目?
      • 所以您希望日志中的文本在

        标记中?不确定我明白你的意思。每次用户按键时都会调用该代码。

      • 是的,现在它运行良好。但我只需要用段落标签分隔的条目。没错!
      【解决方案3】:

      我将在表单中提交 url 链接,每个链接必须在不同的行上。所有这些都挤在一起看起来很奇怪。不好意思哈哈

      【讨论】:

        猜你喜欢
        • 2016-10-04
        • 1970-01-01
        • 1970-01-01
        • 2019-12-22
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多