2009-05-28 2 views
1

Я пытаюсь редактировать разделы сайта inline с помощью jQuery, все работает до сих пор, ожидайте, что некоторые из доступных для редактирования элементов являются ссылками. При попытке редактировать поля, он нажимает на href.Редактирование ссылок inline с jquery - предотвращение их щелчка при редактировании

здесь является JQuery:

$(".button-edit").click(function(){ 
    $(".edit").each(function() { 
     $(this).html('<input type="text" value="' + $(this).html() + '" />'); 
    }); 
}); 

и фрагмент кода HTML:

<li class="list-item" id="list-item-229"><a href="http://test.com/" class="edit">My site</a> 
<p class="edit">lorum ipsum description</p></li> 

после нажатия на кнопку редактирования щелкнул:

<li class="list-item" id="list-item-229"><a href="http://test.com/" class="edit"><input type="text" value="My Site"></a> 
<p class="edit"><input type="text" value="lorum ipsum description"/></p></li> 

Я пытался использовать что-то вроде:

$('.edit > a').bind("click", function(){ 
    return false; 
}); 

однако он не позволяет редактировать поля ввода. Есть ли способ предотвратить клики на href, но сохранить вход редактируемый?

ответ

0

попробовать это: ("Кнопка-сохранить")

var editing=false; 

$(".button-edit").click(function(){ 
$(".edit").each(function() { 
     editing=true; 
     $(this).html('<input type="text" value="' + $(this).html() + '" />'); 
    }); 
}); 

$(".button-save").click(function(){ 
     editing=false; 
     //and you pick text from input and put in <p> 
}); 

$('a.edit').bind("click", function(e){ 
    if(editing){ 
      e.preventDefault(); 
      return false; 
    } 
}); 

В месте $ вы можете установить редактирование = False при выезде редактирования.

+0

Спасибо за гораздо более элегантный пример, однако его по-прежнему не позволяет мне щелкнуть элемент ввода с момента его обертки в тег. Мне, возможно, придется подойти к этой проблеме по-другому, еще раз спасибо! – 2009-05-28 15:17:08

Смежные вопросы