2

ユーザーが入力した文から特定の単語を選択する方法が JQuery にあり、その単語へのリンクを好きなように追加できるようにする方法はありますか? 注: 文はハードコードされていません。文 ユーザーが入力します。文によっては、選択した単語へのリンクを作成する必要があります。

4

3 に答える 3

1

Use 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 に答える