Question

我正在尝试准备一个更改＆＃34;所选文本的Javascript函数＆＃34; url到完全活动的HTML超链接。

我的HTML代码是：

<a class="profile-badge__follow profile-badge__follow--following pull-right" href="#">Unfollow</a>

我的js功能：

<html>
    <body>
        <textarea id="my_input" cols="32" rows="16" textToDisplay>Some text with https://www.google.pl/?gws_rd=ssl for simple WYSIWYG function</textarea>
        <input type="submit" value="[to url]" onclick="make_url('my_input')" />
    </body>
</html>

但是在选择<script> function make_url(my_input) { var my_input=document.getElementById(my_input); var selected_text=window.getSelection(); my_input.value=my_input_begin.value + '<a href="'+selected_text+'">'+ selected_text +'</a>' + my_input_end.value; } </script>并按下提交后，我会得到空的HTML超链接。怎么了？ https://www.google.pl/?gws_rd=ssl / window.getSelection()无法获取所选文字。

第二个问题是 - 如何获取document.getSelection()和my_input_begin.value或仅替换＆＃34;已选择＆＃34;我的my_input_end.value条目的一部分？

Answer 1

我已经整理出来了。最终的Javascript代码是：

text_entry

我用HTML超链接代码替换所有条目text_selected。但我没有找到如何轻松地将<a href="text_selected">text_selected</a>替换为<textarea id="my_input" cols="32" rows="16" textToDisplay>Some text with https://www.google.pl/?gws_rd=ssl for simple WYSIWYG function</textarea> <input type="submit" value="[url]" onclick="text_to_hyperlink('my_input')"/>

最终HTML：

Erfasser

Answer 2

试试这段代码：

<html>
<head>
    <script type="text/javascript" src="jquery-3.1.0.min.js"></script>
</head>
<body>
    <textarea id="my_input" cols="32" rows="16" onclick="this.focus();this.select()">Some text with https://www.google.pl/?gws_rd=ssl for simple WYSIWYG function</textarea>
    <p id="link"></p>
    <input type="button" value="[to url]" onclick="make_url()" />
</body>

首先单击textArea以获取所选文本，然后单击[to url]按钮。

<script>
        function make_url() {
            var textComponent = document.getElementById("my_input");
            var selectedText;
              // IE version
              if (document.selection != undefined)
              {
                textComponent.focus();
                var sel = document.selection.createRange();
                selectedText = sel.text;
              }
              // Mozilla version
              else if (textComponent.selectionStart != undefined)
              {
                var startPos = textComponent.selectionStart;
                var endPos = textComponent.selectionEnd;
                selectedText = textComponent.value.substring(startPos, endPos)
              }
            var link = document.getElementById("link");
            var a = document.createElement("a");
            var href = document.createTextNode("Link");
            a.appendChild(href);
            a.setAttribute("href", selectedText);
            document.body.appendChild(a);
    }

注意：每次在textArea中添加新文本并单击[to url]按钮时，都会生成一个新的超级链接。我也使用了jquery库来选择，因此您必须将它附加到页面上。

希望它运作良好☻

使用java脚本为HTML textarea中的选定文本创建活动的超链接

2 个答案: