Wie ändert man den booleschen Wert eines Elements, wenn ein anderer in HTML über JavaScript angeklickt wird?

Ich versuche, eine Liste so zu machen, dass jedes Element vom Benutzer bearbeitet werden kann, da die Liste durch Benutzereingaben erstellt wird. Ich fange gerade an, JavaScript zu benutzen, und lerne noch. Was kann ich durch den Pseudo-Code-Teil ersetzen, der den gewünschten Effekt erzeugt?Wie ändert man den booleschen Wert eines Elements, wenn ein anderer in HTML über JavaScript angeklickt wird?

HTML:

<li v-for="item in items" contenteditable="false" id="item">{{item}} 
    <button id="editButton" contenteditable="false" onclick="edit()">Edit</button>

JS (Pseudocode):

function edit(){ 
    when "editButton" is clicked{ 
     "contenteditability" in "item" = true; 
    } 
}

Quelle

2017-04-04 user147219

dieser Pseudo-Code funktioniert theoretisch wie ein Zauber ... whatts das Problem einstellen können? – Konstantinos

So ist der Knopf in der Li? Verwenden Sie das Ereignisziel, um die Schaltfläche abzurufen, wählen Sie das übergeordnete Element aus, und legen Sie das Attribut fest. – epascarello

Und alle Antworten nehmen an, dass es eine gibt ... Sie können sehen, dass es eine Vorlage ist, so dass IDs falsch sind, da es mehrere Elemente mit derselben ID geben wird. – epascarello

Verwenden Ereignisse zu bestimmen, welche Schaltfläche geklickt wurde und die Eltern wählen. Als Sie das Attribut

function edit(event) { 
 
    var button = event.target, 
 
    li = button.parentNode; 
 
    li.setAttribute("contentEditable", true) 
 
}

<ul> 
 
    <li contenteditable="false"> AAAAA 
 
    <button contenteditable="false" onclick="edit(event)">Edit</button></li> 
 
    <li contenteditable="false"> BBBBB 
 
    <button contenteditable="false" onclick="edit(event)">Edit</button></li> 
 
    <li contenteditable="false"> CCCCC 
 
    <button contenteditable="false" onclick="edit(event)">Edit</button></li> 
 
</ul>

Quelle

2017-04-04 22:20:35 epascarello

function edit(){ 
 
    $("#item").setAttribute("contenteditable", "true") 
 
}

Quelle

2017-04-04 22:09:09

Ich denke, dass Sie jquery mit einfachem Javascript mischen ... 'setAttribute' sollte' attr' sein. – jas7457

setAttribute ist eine Funktion in jquery. –

@PrakashSundar welche Version ?? Es ist attr() http://api.jquery.com/attr/ – epascarello

Wie wäre es

function edit() { 
    document.getElementById('item').setAttribute('contentEditable','true'); 
}

Quelle

2017-04-04 22:09:22 user3094755

Versuch:

function edit(){ 
    document.getElementById('item').setAttribute('contenteditable',true); 
}

Quelle

2017-04-04 22:09:42

<html> 
    <body> 
    <ul> 
     <li v-for="item in items" contenteditable="false" id="item>{{item}}</li> 
    </ul> 
    <button type="button" id="editButton" contenteditable="false"> 
    </body> 
    <script src="https://code.jquery.com/jquery-3.2.1.min.js" integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4=" crossorigin="anonymous"></script> 
    <script> 
    $(document).ready(function(){ 
     $('#editButton').on('click', function(){ 
     $('#item').attr('contenteditable', 'true'); 
     // or 
     // $('#item').prop('contenteditable', true); 
     }); 
    }); 
    </script> 
</html>

Hoffnung, dies hilft Ihnen

Quelle

2017-04-04 22:12:10 TypedSource

Wie ändert man den booleschen Wert eines Elements, wenn ein anderer in HTML über JavaScript angeklickt wird?

Antwort

Verwandte Themen