我想让html表的一些单元格可编辑,只需双击一个单元格,输入一些文本,然后可以将更改发送到服务器.我不想使用像dojo数据网格这样的工具包.因为它提供了一些其他功能.您能否提供一些代码片段或有关如何实现它的建议？
更改div值时,如何触发事件？
<div class="changeable" contenteditable="true"> Click this div to edit it <div>
因此,当内容发生变化时,我想创建一个警报和/或做其他事情:
$('.changeable').text().change(function() {
alert('Handler for .change() called.');
});
下面的小提琴允许将文本粘贴到a中<textarea>并生成相同的段落,动态地<p>由相同数量的字符组成.
发生的问题是; 来自先前动态生成的段落的文本<p>在每个标记内溢出,并且不会正确地继续到下一个动态段落.因此,用户是否可以按Enter键并将该内容向下移动到下一个现有段落中,同时仍然动态且自动地保留现有格式？
如果可以提供一个新的小提琴,我将非常感激,因为我还是新编码.再一次,小提琴可以在这里找到.
更新:是否可以生成段落,用户可以按Enter键,如果可能,将其内容无缝地移动到下面的段落中？并且当按下退格按钮时应用同样的内容,以使内容向上移动到上一段？出现的问题是,当按下回车时,文本似乎由于css中的溢出属性而隐藏文本.
$(function() {
$("#Go").on('click', function() {
var theText = $('textarea').val();
var numberOfCharacters = 300;
while (theText.length) {
while (theText.length > numberOfCharacters &&
theText.charAt(numberOfCharacters) !== ' ') {
numberOfCharacters++;
}
$("#text_land").append("<br><\/br><p>" + theText.substring(
0, numberOfCharacters) +
"<\/p><br><\/br>");
theText = theText.substring(numberOfCharacters);
numberOfCharacters = 300;
$('p').attr('contenteditable', 'true');
$("p").addClass("text");
}
})
})
$('select').on('change', function() {
var targets = $('#text_land p'),
property = this.dataset.property;
targets.css(property, this.value);
}).prop('selectedIndex', 0); …代码如:
...text <span contenteditable="true" onChange="someFunction()">blah blah</span> text...
onChange事件不起作用.(至少在FireFox中)
我不想使用textarea/input标签,因为必须只能更改文本中的特定单词,并且必须以内联方式显示(而不是阻止).
有什么方法可以做到吗？
由于w3c将DOM变异标记为已弃用(请参阅http://www.w3.org/TR/DOM-Level-3-Events/#events-mutationevents),是否有(快速)替代方法来检测属性修改在DOM？
我试图弄清楚是否有任何方式来监听像属性focus或change具有contenteditable属性的HTML元素的事件.
我有这个HTML标记:
<p id="test" contenteditable >Hello World</p>
我试过这些没有任何成功(JSBin):
var test = document.querySelector('#test');
test.addEventListener('change', function(){
alert('content edited');
}, false);
test.addEventListener('DOMCharacterDataModified', function(){
alert('content edited');
}, false);
test.addEventListener('focus', function(){
alert('content edited');
}, false);
我不想听键盘或鼠标事件.我没有找到任何明确的文件W3C和MDN有关contenteditable.
是否可以在内容可编辑的HTML元素上收听change和/ focus或其他事件？
当按键改变文本框的输入时,我想做某事.我认为keypress事件最适合这个,但我怎么知道它是否引起了变化？我需要过滤掉像箭头键或修饰符这样的东西...我不认为硬编码所有值是最好的方法.
那我该怎么办呢？
男人我有一个属性contentEditable为真的div !
我之所以这样做,是因为我希望它像一个textarea,根据它的文字改变它的高度!作品完美
但是,当我复制一个超链接并将其粘贴到我的div而不是纯文本时,它有锚元素...如果我选择任何网站的某些部分并将其粘贴到该contenteditable div中它显示所有HTML,则与其他部分相同.我希望div只显示纯文本并禁用其中的所有元素!
工作小提琴:http://jsfiddle.net/4ctVx/
只需复制其中的任何HTML,它也会显示youdiv与该HTML.我想要禁用它而div只显示纯文本!
现在,每个人都知道可爱的小技巧,你可以将这个Javascript代码打到浏览器的URL栏中:
document.body.contentEditable = 'true'; document.designMode = 'on'; void 0
还有El Presto!您可以根据自己的需要开始自由编辑网站.
唯一的问题是 - 你无法保存它!
在做了一些快速研究之后,我发现很可能,保存这个的最好方法是通过这里建议的方法,其中包括以某种方式将页面变成一个巨大的形式并将其发布到MySQL数据库.
当然,虽然这样做很棒,但它最终会保存我的整个页面 - 而不仅仅是我想要编辑的部分或容器 - 这是一个主要问题,因为我们的开发人员需要保留代码行,例如......
<?php include('header.php'); ?>
...没有在HTML中输出.换句话说:它将保存我的页面,因为它出现在输出的HTML中,覆盖了原始PHP文件中的内容.
我问的是怎么做,我将如何保存一个这样编辑的网站,但只是为了保存或更新网站上的一个或两个可编辑的容器(不是整个事情所以我的PHP代码不会被覆盖)？
例如:
<p>This Won't get updated when the page is "saved"</p>
<div id="update-this-contianer">
This area will be passed on to the MySql database, and then updated into the same section of the original file.
</div><!-- End Area To Update -->
chrome支持该isContentEditable属性(在"Inspect Element"中列出它),但报告falseINPUT,FORM - 实际上是一切.
例如,我也认为INPUT,非读取,应该是真的.
有谁知道发生了什么事？
我有此代码：
<div contenteditable="true"><p><?php echo $row[1]; ?></p></div>
我可以接受div的内容并将其作为POST参数发送，以便在PHP中使用它们。如果可以使用，那就好了：onchange =“ this.form.submit（）”。
谢谢！