Доброе утро всем. У меня есть div, в который я могу сохранить текст, когда нажимаю кнопку сохранения, но мне хотелось бы, чтобы текст просто автоматически сохранялся при событии onmouseout. Например:
У меня есть div и две кнопки (Сохранить и Отменить). В настоящее время пользователь может навести указатель мыши на текущие текстовые данные внутри элемента div, щелкнуть текст и затем он может редактировать указанный текст. Единственный способ сохранить этот текст - нажать кнопку «Сохранить». Есть ли способ использовать onmouseout для сохранения текста, чтобы пользователь просто щелкнул и отредактировал текст, затем щелкнул прочь и сохранил его? Спасибо!
Хорошо, поэтому приведенный ниже код - это то, что у меня есть, но, похоже, оно не работает. Я не беспокоюсь о сохранении кода б / у, который у меня уже есть в другом месте. Я просто пытаюсь перевести его туда, где я могу набрать текст, запустить onBlur и вернуть HTML обратно к тому, как он выглядел до того, как я щелкнул текст. На данный момент я могу щелкнуть по нему, и текстовое поле внутри div появляется, но когда я нажимаю за пределами div, текстовое поле остается видимым. Есть идеи?
function setClickable() {
$('#editInPlace').click(function() {
var textarea = '<div onBlur="saveChanges()><textarea rows="3" cols="30">' + $(this).html() + '</textarea>';
//var button = '<div><input type="button" value="SAVE" class="saveButton" /> OR <input type="button" value="CANCEL" class="cancelButton" /></div></div>';
var revert = $(this).html();
$(this).after(textarea).remove();
})
.mouseover(function() {
$(this).addClass("editable");
})
.mouseout(function() {
$(this).removeClass("editable");
saveChanges(this, revert);
});
};
function saveChanges(obj, cancel) {
if (!cancel) {
var t = $(obj).parent().siblings(0).val();
//need some post code for saves
}
else {
var t = cancel;
}
if (t == '') t = '(click to add text)';
$(obj).parent().parent().after('<div id="editInPlace">' + t + '</div>').remove();
setClickable();
}