Question

我目前有一个编辑器，允许用户输入输入并在特定标题下保存输入。我有一个允许他们这样做的按钮，以及使用追加子项将他们的标题名称添加到一个框（只有一个白色背景的div）。

想知道我如何链接这些标题，这样当他们点击一个标题时，分配给所述标题的文本输入会显示在我的编辑器中？

使用Javascript：

    <!-- Function to save the user's input inside editor1 -->
    function saveEdits() {
        var editElem = document.getElementById("editor1");
        var userVersion = editElem.innerHTML;
        localStorage.userEdits = userVersion;

        //Get the title from the user
        var title = prompt("What would you like your title to be?");
        localStorage.setItem(title, editElem.innerHTML);

        //Asigning the titles input by the user to the key "titles"
        titles = localStorage.getItem("titles");

        if (titles == null){
            titles = [];
        }
        else {
            titles = JSON.parse(titles);
        }

        var obj;
        obj = {"titles": title};
        titles.push(obj);
        localStorage.setItem("titles",JSON.stringify(titles));

        //Save the editor contents to local storage based on title
        document.getElementById("update").innerHTML = "Edits saved!";
        var theDiv = document.getElementById("Contentable");
        var content = document.createTextNode(title);
        theDiv.appendChild(content);
        var br = document.createElement("br");
        theDiv.appendChild(br);

    }

    <!-- Function to check if the user has any saved input -->
    function checkEdits() {
        if(localStorage.userEdits != null)
        document.getElementById("editor1").innerHTML = localStorage.userEdits;
    }

    function loadEdits(title) {
        //load useredit for title from local storage
        var userEdits = localStorage.getItem(title);
        var editElem = document.getElementById("editor1");
        editElem.innerHTML = userEdits;
    }

HTML（编辑）：

<!-- Editor 1 -->
    <div id="editor1" contenteditable="true" style="margin-left:30em">
    </div>
    <input id="savechanges" type="button" value="Save Changes" onclick="saveEdits()"/>
    <div id="update">Click to save your changes made</div>

Answer 1

您可以将onclick事件附加到标记。像这样。

func play() {

    if let data = NSData(contentsOfURL: savePath) {
        do {
            try AVAudioSession.sharedInstance().setCategory(AVAudioSessionCategoryPlayback, withOptions: .AllowBluetooth)
            try AVAudioSession.sharedInstance().setActive(true)
            audioPlayer =   try AVAudioPlayer(data: data, fileTypeHint: AVFileTypeAppleM4A)
            audioPlayer!.prepareToPlay()
            audioPlayer!.play()

        } catch let error as NSError {
            print("Unresolved error \(error.debugDescription)")
        }
    }
}

js

<div class="container>
<h2 class="title" onclick="edit(this)">
   EDITABLE CONTENT BELOW
</h2>
<div class="editable" onclick="edit(this)">
</div>

这就是您可以获取内容并临时存储活动父级作为参考的方式。因此，当您保存时，var activeParent; function edit( element ){ var title = element.parentNode.children[ 0 ].innerHTML; var content = element.parentNode.children[ 1 ].innerHTML; //do stuff with the markup activeParent = element.parentNode; }。

编辑：由于所有这些都是相对参考，您可以根据需要使用多个。使用activeParent时要小心。它假设您一次只编辑一个区域。

如何链接附加标题？

1 个答案: