Jeditable - Yをクリックすることで、Xの編集を有効にします

StackOverflow https://stackoverflow.com/questions/366595

  •  21-08-2019
  •  | 
  •  

質問

私は、インライン編集ソリューションとして Jeditable のを使用しようとしている。

デフォルトの動作は、（それを編集する要素をクリックして）非常によく動作しますが、私は別の要素をクリックすることで、元素を活性化したいと思います。

たとえばa.activateEditをクリックすると、（明らかにjQueryのセレクタを使用して行われるべきである）次のdiv.editをアクティブにします。

私は、このためにJeditableドキュメントに見てきたが、右の構文を見つけることができませんでした。

FYI、デフォルトJeditableの構文は、の線に沿って何かあります：

 $(document).ready(function() {
     $('.edit').editable('http://www.example.com/save.php');
 });

の *編集：見つけより良い解決する * の

役に立ちましたか？

解決

上記のコードは、いずれかの非常に正確ではありません。これは、すべてのJeditableインスタンス上でイベントをクリックトリガーます。

があり、それを行うには多くの方法があり、それはすべてあなたのHTMLによるが、例えば次のようなHTMLを持っている場合：

<div class="edit" id="unique_id">Editable text</div> 
<a href="#" class="edit_trigger">Edit me!!</a>

そして、次のJavaScriptを使用することができます 

/* Bind Jeditable instances to "edit" event. */
$(".edit").editable("http://www.example.com/save.php", {
    event     : "edit"
});
/* Find and trigger "edit" event on correct Jeditable instance. */
$(".edit_trigger").bind("click", function() {
    $(this).prev().trigger("edit");
});

他のヒント

あなたは他の要素のクリック機能にこのコードを配置することができます。例：

HTMLます：

<a class="clickme">Click me to edit</a>
<div class="edit">Edit Me!</div>

jQueryの：

$(document).ready(function() {
$("a.clickme").click(function(){
     $('.edit').editable('http://www.example.com/save.php');
});
});

[OK]を、のdidn のアタの答え「tはそれが正しい道に私を設定しなかったが、かなりの仕事ます：

$(document).ready(function() {
    $('.edit').editable('http://www.example.com/save.php');
    $("a.clickme").click(function(){
          $('.edit').click();
   });
});

私はそうのような次の編集可能な要素をターゲットに、前の2つの応答の力を組み合わせました

/* Find and trigger "edit" event on next Jeditable instance. */ $(".edit_trigger").livequery( 'click', function() { $(this).next().click(); });

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top