Question

我最近决定使用jQuery文本编辑器。但是，当我访问我使用jqte的textarea时，我很困惑，textarea显示没有数据。

                             <!DOCTYPE html>
              <html>
              <head>
               <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
              <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
           <title>jQuery TE | Downloaded Demo | v.1.3.6</title>

  <link type="text/css" rel="stylesheet" href="demo.css">
  <link type="text/css" rel="stylesheet" href="../jquery-te-1.3.6.css">

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js" charset="utf-8"></script>
<script type="text/javascript" src="../jquery-te-1.3.6.min.js" charset="utf-8"></script>
 </head>

<body>
 <h1>jQuery TE</h1>

<div class="navigation">
<a href="http://jqueryte.com" target="_blank">Home</a>
<a href="http://jqueryte.com/demos" target="_blank">Demos</a>
<a href="http://jqueryte.com/documentation" target="_blank">Documentation</a>
<a href="http://jqueryte.com/comments" target="_blank">Comments</a>
<a href="http://jqueryte.com/about" target="_blank">About</a>
<a href="http://jqueryte.com/license" target="_blank">License</a>
</div>

<h2>Demo | v.1.3.6</h2>


  <!------------------------------------------------------------ jQUERY TEXT EDITOR  

 <textarea  cols="2" rows="3" name="textarea" class="jqte-test"  id="mytextarea"><b>My      contents are from <u><span style="color:rgb(0, 148, 133);">TEXTAREA</span></u></b></textarea>

<p>
<button class="status">Toggle jQTE</button>
</p>
<hr>

<input name="input" type="text" value="<b>My contents are from <u><span style=&   quot;color:rgb(0, 148, 133);&quot;>INPUT</span></u></b>" class="jqte-test"/>

  <div name="div" class="jqte-test"><b>My contents are from <u><span style="color:rgb(0, 148, 133);">DIV</span></u></b></div>

   <script>
  $('.jqte-test').jqte();

 // settings of status
 var jqteStatus = true;
  $("textarea#mytextarea").bind(function(){ alert($(this).html()) ;});
 $(".status").click(function()
 {
    jqteStatus = jqteStatus ? false : true;
    $('.jqte-test:first').jqte({"status" : jqteStatus})
  });
 </script>

我实际上正在检查如何获得jqte格式的html？没有全面的说明。有人能帮助我吗？

Answer 1

实际的编辑器窗口是一个带有“jqte_editor”类的div。

所以......

$(".jqte_editor").html()

...将为您提供最新/已编辑的内容。

Answer 2

我遇到了同样的问题，这就是我要解决的问题。

我注意到插件有一个setter但不是getter等价于编辑器的值;这很奇怪，因为用于创建具有值的内容的插件的普通jQuery模式是让getter成为setter的无负载paramater版本。

所以我查看了插件代码并进行了修改。从未压缩的代码版本：

此：

$.fn.jqteVal = function(value){
   $(this).closest("."+vars.css).find("."+vars.css+"_editor").html(value);      
}

更改为：

$.fn.jqteVal = function(value){
    if(typeof value === 'undefined'){
        return $(this).closest("."+vars.css).find("."+vars.css+"_editor").html();
    }else{
        $(this).closest("."+vars.css).find("."+vars.css+"_editor").html(value);
    }
}

来自＆＃39; minified＆＃39;版本：

此：

e.fn.jqteVal=function(t){e(this).closest("."+u.css).find("."+u.css+"_editor").html(t);}

更改为：

e.fn.jqteVal=function(t){if(typeof t === 'undefined'){return e(this).closest("."+u.css).find("."+u.css+"_editor").html();}else{e(this).closest("."+u.css).find("."+u.css+"_editor").html(t);}}

进行更改后，您现在可以像使用任何其他jQuery值函数一样使用jqteVal()函数：

$(SELECTOR).jqteVal("text that goes into editor"); //Setter
var editor_value =     $(SELECTOR).jqteVal();      //Getter

我不确定为什么作者没有这样做，但我在这种方法上取得了很大的成功。

Answer 3

使用

$("textarea").html()

而不是val()，因为它更安全，它会逃脱特殊字符并阻止Xss攻击

jQuery html() method

然而，如果您需要将输入文本显示为“实时”，则可以使用.val（）方法

Answer 4

Use this as said in documentation:

$(".editor").jqteVal("New article!");

Answer 5

可能使用val（）而不是text（）：

 window.setInterval (function(){alert($("textarea").val());},3000);

Answer 6

如果你有一个id为“MYTEXTAREA”的文本区域

您可以像

一样访问它

window.setInterval (function(){alert($("textarea#MYTEXTAREA").val());},3000);

Answer 7

使textarea成为文本编辑器

$("#textareaID").jqte();

并阅读数据

var text = $("#textareaID").text();

或

alert($("#textareaID").text());

Answer 8

我会使用更改事件而不是超时。

$('#textareaID').bind('input propertychange', function() {
//...
});

并使用.html（）而不是.text（）来查看html格式。或者将所有\ n替换为＆lt; b r /> （没有空格）

Answer 9

将此代码添加到您的脚本中。

$('.jqte-test').on("keyup", function(){
        var content = $(this).html();
        $(this).parent('.jqte-test').find('textarea').val(content);
    });

所以你可以在 textarea 本身获得所需的。

Answer 10

也许我来不及但我也在寻找一个解决方案而不改变原来的CSS，因为有些页面我想要它默认，有些我想要一个自定义尺寸。在插件js之后简单地设置内联css。像这样的东西。

if

Jquery文本编辑器

10 个答案: