jquery関数でhrefをvarとして使用する

Question

divにいくつかの変数を追加する必要がある関数があります。 varsの1つは、onclickとのhrefリンクです。関数内でvar内で動作するようにリンクをフォーマットするにはどうすればよいですか？以下は動作していません。この全体の目的は

• にされている何

  は、テキストのブロックを評価します。右、スパン内の別のAHREFリンクを挿入するリンク後のテキスト

• の残りの部分の周りにスパンを投げるテキスト
• の残りの部分の前のonclickとAHREFリンクを挿入数え、200文字
• に表示を制限クロージングspanタグ
• と私は2つのコードスニペットを撮影した

のdivにこの変更内容のすべてを挿入する前に、

• 1）テキストをトリム、およびスパンでjquery limit text by length

• 2を包む）、クリック時に表示され、クリック​​

に隠し、私は必要なものを考え出すそれらを一緒にマッシュアップしようとしています。各スニペットは単独で動作します。

これは、私は今それを持っているようなコードです：

<script type="text/javascript"> 
    function showStuff(id) { 
     document.getElementById(id).style.display = 'block'; 
    } 
    function hideStuff(id) { 
     document.getElementById(id).style.display = 'none'; 
    } 
$(function() { 
    var limit = 200; 
    var chars = $("#myDiv").text(); 
    if (chars.length > limit) { 
     var visiblePart = $("<div> "+ chars.substr(0, limit-1) + "</div>"); 
     var readMore = $(<a href="#" onclick="showStuff('answer1'); return false;">open</a>);  
     var hiddenPart = $("<span id='answer1' style='display: none;'> " + chars.substr(limit-1) + "</span>"); 
     var readLess = $(<a href=\"#\" onclick=\"hideStuff('answer1'); return false;\">close</a>); 
     }); 

     $("#myDiv").empty() 
      .append(visiblePart) 
      .append(readMore) 
      .append(hiddenPart) 
      .append(readLess); 
    } 
}); 

Answer 1

修正ので、両方のリンクが同じで表示されませんでした上記のフェリックスのバージョン時間：

http://jsfiddle.net/cXw5D/4/

EDIT：

は、構文1の最後の時間をクリーンアップ：

http://jsfiddle.net/cXw5D/5/

Answer 2

あなたはjQueryのを使用する場合は、それを一貫して使用しています。上記の最大のエラーは、HTMLが文字列の中にないことです。そのため、JavaScriptでは構文エラーが発生します。

$(function() { 
    var limit = 200; 
    var chars = $('#myDiv').text(); 
    if (chars.length > limit) { 
     var visiblePart = $('<div />').text(chars.substr(0, limit-1)); 
     var readMore = $('<a />', { 
      href: '#', 
      click: function() { 
       hiddenPart.show(); 
       return false; 
      }, 
      text: 'open' 
     });  
     var hiddenPart = $('<span />', {text: chars.substr(limit-1)}).hide(); 
     var readLess = $('<a />', { 
      href: '#', 
      click: function() { 
       hiddenPart.hide(); 
       return false; 
      }, 
      text: 'close' 
     }); 

     $('#myDiv').empty() 
      .append(visiblePart) 
      .append(readMore) 
      .append(hiddenPart) 
      .append(readLess); 
    } 
}); 

これは完璧な程遠いですが、あなたのスタートを与えるかもしれない：ここで

は少し改良版である http://jsfiddle.net/fkling/cXw5D/