Navigation

4/02/2014

javascript to highlight text, and to remove highlight

I had script to highlight text (using a div tag), but want to be able to quickly remove it, when I do another search, and want to highlight new phrase.




http://www.elated.com/articles/jquery-removing-replacing-moving-elements/



<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">

$( init );

function init() {

  // Remove the #myDiv element but leave its contents
  $('#myPara').unwrap();
}

</script>

</head>
<body>

  <div id="myDiv">
    <p id="myPara">A paragraph of text</p>
    <p>Another paragraph of text</p>
  </div>



http://www.the-art-of-web.com/javascript/search-highlight/  


Whole tag:
http://stackoverflow.com/questions/4232961/jquery-remove-a-tag-but-keep-innerhtml 






http://csdirect.iii.com/sierrahelp/Default.htm#sgcir_recent_circ_hist.html?Highlight=viewing%20the%20recent


http://csdirect.iii.com/sierrahelp/Content/Resources/Scripts/autoSearchComplete.js


function quickSearch(searchTerm) {
    if (searchTerm == "") {
        $("#autoCompleteContainer").html("");
        $("#autoCompleteContainer").append("<div id='search_suggestions_box'>Begin typing to begin your Quick Search</div>")
   
        return false;
    }
    var quickSearchArray = new Array();
    var quickSearchCount = 0;
    if (window.populatingURLS) {
        $("#search_suggestions_box").html("<span class='section_title'>Loading Data...</span>");
        return false;
    }
   

    $("#search_suggestions_box").html("<span class='section_title'>Full-Text Search</span><p id='search_text'> Continue searching for <span style='color:#B75F11'>\""+searchTerm+"\"</span> by clicking on the search icon</p><div id='suggestions_section' class='section'><span class='section_title' id='suggestions'>Documents with <span style='color:#B75F11'>\""+searchTerm+"\"</span> in the title<hr><div id='suggestions_list'><ul id='suggestions_list_ul'></ul></div></div>");
   
    myUrls = getLocalData("localStorageUrls")
    if (myUrls != undefined && (window.urls == undefined || window.urls == "" || window.urls.length <= 0)) {
        window.urls = JSON.parse(myUrls);
    }
    //Read in all of the url data
    for (x in window.urls) {
        urlData = window.urls[x];

        //IE refuses to let the below code continue. :(( Try catch is my solution for now
        try {
            t = urlData.Title;
            tLower = t.toLowerCase();
        }
        //If we fail here then just let the code fall through to return no change
        catch (e) {
            continue;
        }

        s = urlData.Source;
        //aLower = a.toLowerCase();
        searchTermLower = searchTerm.toLowerCase();
       
        searchPatt = new RegExp("("+searchTerm+")", "gi");
        if (tLower.match(searchTermLower) || s.toLowerCase().match(searchTermLower)) {
            t = t.replace(searchPatt, "<span class='mc-highlightSearch1'>$1</span>")
            //a = a.replace(searchPatt, "<span class='highlight' style='background:#ffc000'>$1</span>")
            s = s.replace(/\.\.\/Content\//g, "")+"?Highlight="+searchTerm.replace(/[^A-z0-9\.\s]/g, " ");
       
            if (window.modulesActive["highlight"]) {
                $("#suggestions_list_ul").append("<li ><A href='#"+s+"' onclick=\"$('#autoCompleteContainer').slideUp();highlightButtons('on')\">"+t+"</a></li>");
            }
            else {
            $("#suggestions_list_ul").append("<li ><A href='#"+s+"' onclick=\"$('#autoCompleteContainer').slideUp()\">"+t+"</a></li>");
            }
            quickSearchCount +=1;
            if (quickSearchCount > 20) {
                return false;
            }
        }
    }
}


No comments:

Post a Comment