2

在 JQuery 中有没有办法从用户输入的句子中选择一个特定的词,他可以添加一个链接到这个词的任何他想要的。注意:句子不是硬编码的,我们不知道哪个句子用户将输入。根据句子,我们必须创建指向所选单词的链接。

4

3 回答 3

1

结合使用 JavaScript 和 jQuery 中的资源来获取用户选择的文本,然后用它做一些事情(有用吗?)使用 jQuery 和下面的 Sridhar Narasimhan 回答的部分包装文本,您可以提出以下内容(未经测试):

HTML:

<input type="text" id="enter"/>
<div id="content" ></div>
<div id="link" ></div>

Javascript

$("#enter").bind("keyup", function() {
    $("#content").html($("#enter").val());
});

$.expr[":"].containsNoCase = function(el, i, m) {
    var search = m[3];
    if (!search) return false;
    // we'll use text to find what we want...
    return eval("/" + search + "/ig").test($(el).text());
};


if (!window.Kolich) {
    Kolich = {};
}

Kolich.Selector = {};
Kolich.Selector.getSelected = function() {
    var t = '';
    if (window.getSelection) {
        t = window.getSelection();
    } else if (document.getSelection) {
        t = document.getSelection();
    } else if (document.selection) {
        t = document.selection.createRange().text;
    }
    return t;
}

$.expr[":"].containsNoCase = function(el, i, m) {
    var search = m[3];
    if (!search) return false;
    // we'll use text to find what we want...
    return eval("/" + search + "/ig").test($(el).text());
};


Kolich.Selector.mouseup = function() {
    var st = Kolich.Selector.getSelected();
    if (st != '') {
        // alert("You selected:\n" + st);
        // wrap selecetd word in a link
        $("#content:containsNoCase('" + st + "')").each(function() {
            var textwithLink = '<a href="javascript:alert(\'link-to-selected-text.htm\')">' + st + '</a>';

            $("#link").html(textwithLink);

        });
    }
}

$(document).ready(function() {
    $(document).bind("mouseup", Kolich.Selector.mouseup);
});

工作演示

于 2012-12-10T11:43:37.747 回答
0

尝试这个。

      Your HTML Structure.
     <input type="text" id="enter"/>
     <input type="text" id="link"/>
     <button type="button" onclick="doAction()">Make Link</button>
     <div id="content" >Mrinmoy Ghoshal</div>

这是你的功能

       function doAction(){

       var enterv=document.getElementById('enter').value;
       var linkv=document.getElementById('link').value;
       var str=document.getElementById('content').innerHTML;

       var strnew=str.replace(enterv,'<a href="'+linkv+'">'+enterv+'</a>');
       document.getElementById('content').innerHTML=strnew;
       alert(strnew);
       }

工作演示

于 2012-12-10T11:56:15.857 回答
0
Try the below

<input type="text" id="enter"/>
    <div id="content" ></div> 



$("#enter").bind("keyup",function(){

$("#content").html($("#enter").val().replace("Jquery","<a href=''  >Jquery</a>"));
});

在输入中输入 Jquery 并检查它。

http://jsfiddle.net/aDRB6/11/

谢谢

于 2012-12-10T11:09:00.910 回答