使用contenteditable和jquery更改URL

时间:2014-01-29 17:22:50

标签: jquery asp.net-mvc html5 contenteditable

在使用可更改文本中的更改替换从MVC actionlink获取的部分查询字符串时遇到问题。可以获得第一个按钮来显示正确的输出而不是其余的。有什么想法吗?

<br />
<div class="largeImageSection">
    <div class="galleryImageNameContainer">
        <span class="editableText" data-filenameexclext="Change me 1!" >Change me 1!</span>
    </div>
    <div class="galleryButtonContainer">
        <span class="renameButton" >
            <a href="http://www.google.com/RenameUploadedFile?fileNameExclExtension=checkthis&fileExtension=.jpg&directory=banners&newFileNameExclExtension=placeHolder"></a>
            <button onclick="$(this).siblings().first().click();" >Rename</button>
        </span>
    </div>
</div>
<br />
<div class="largeImageSection">
    <div class="galleryImageNameContainer">
        <span class="editableText" data-filenameexclext="Change me 2!" >Change me 2!</span>
    </div>
    <div class="galleryButtonContainer">
        <span class="renameButton" >
            <a href="http://www.google.com/RenameUploadedFile?fileNameExclExtension=checkthis&fileExtension=.jpg&directory=banners&newFileNameExclExtension=placeHolder"></a>
            <button onclick="$(this).siblings().first().click();" >Rename</button>
        </span>
    </div>
</div>
<br />
<div class="largeImageSection">
    <div class="galleryImageNameContainer">
        <span class="editableText" data-filenameexclext="Change me 3!" >Change me 3!</span>
    </div>
    <div class="galleryButtonContainer">
        <span class="renameButton" >
            <a href="http://www.google.com/RenameUploadedFile?fileNameExclExtension=checkthis&fileExtension=.jpg&directory=banners&newFileNameExclExtension=placeHolder"></a>
            <button onclick="$(this).siblings().first().click();" >Rename</button>
        </span>
    </div>
</div>

<script type="text/javascript">
    $(".editableText").attr("contenteditable", "true");
    var theContent = $(".editableText"); // set the content.

    $(".renameButton a").click(function (e) {
        var originalContent = $(".editableText").data("filenameexclext");
        var testContent = "newFileNameExclExtension=placeHolder";
        var editedContent = "newFileNameExclExtension=" + theContent.html();
        $(this).attr("href", $(this).attr("href").replace(testContent, editedContent));
        alert(editedContent);
        e.preventDefault();
    });

</script>

1 个答案:

答案 0 :(得分:0)

你不需要

var theContent = $(".editableText").text();

获取元素内的文本?