0

だから私はhtmlテンプレートを持っています:

      <div style='background-color: red;'>
          <div>
                $QuestionUpButton
              <%--<img style="cursor: pointer" onclick="onAddQUestionVote" src="../../Images/arrow-up-24-ns.png" data-questionvoteupbutton="$i" id='addQuestionVote' alt='Vote up' data-questionid='$questionUid' />--%>
              <span data-questionvotegroup='$i'>$QuestionVote</span>
              <span data-questiontextgroup='$i'>$textboxText<br />
              </span>
          </div>
          <div id="mm" style='background-color: white;'>
              $AnswerUpVote
              <%--<img style="cursor: pointer" onclick="onAddAnswerVote" src="../../Images/arrow-up-24-ns.png" data-answervoteupbutton="$i" id='addAnswerVote' alt='Vote up' data-answeruid='$answerGuid' />--%>
              <img style="cursor: pointer" onclick="onRemoveAnswerVote" src="../../Images/arrow-down-24-ns.png" data-answervotedownbutton="$i" id='removeAnswerVote' alt='Vote down' data-answeruid='$answerGuid' />
              <span data-answervotegroup='$i'>$AnswerVotes</span>
              <span data-labelgroup='$i'>Answer : </span>
              <span data-answertextgroup="$i" data-questionid='$questionUid' data-answerid="$answerGuid">$AnswerSpan</span>
              <input type='button' id='editButton' data-editlinkbuttongroup="$i" value='Edit' />
              <input type='button' id='deleteButton' data-deletelinkbuttongroup="$i" value='Delete Question' />
          </div>

      </div>

ドキュメントの読み込み時に、次のようにすべての $ 変数を置き換えるコードを実行します。

function MyFunction(result) {
    //console.log(result);
    var panel = $('#mypanel');
    var userGuid = GetUserGuid().d;
    var panel = $('#MainContent_AnsweredQuestions_mypanel');

    for (var k = 0; k < result.d.length; k++) {
        var notVotedQuestion = "<img style='cursor: pointer' onclick='onAddQUestionVote' src='../../Images/arrow-up-24-ns.png' data-questionvoteupbutton='" + i + "' id='Img1' alt='Vote up' data-questionid='" + result.d[k].Uid + "' />";
        var notVotedQuestion1 = "hulabula";
        var notVotedAnswer = "notVotedAnswer";
        var votedAnswer = "";

        console.log(result.d[k].Uid)
        var html = $("#OwnerTemplateQuestionWithoutAnswer").html().replace(/\$i/g, i)
            .replace(/\$AnswerSpan/g, result.d[k].Answers[0].Conetent)
            .replace(/\$answerGuid/g, result.d[k].Answers[0].Uid)
            .replace(/\$questionUid/g, result.d[k].Uid)
            .replace(/\$QuestionVote/g, result.d[k].QuestionVotes.length)
            .replace(/\$AnswerVotes/g, result.d[k].Answers[0].AnswerVotes.length)
            .replace(/\$textboxText/g, result.d[k].Content);

        //var html1 = $("#OwnerTemplateQuestionWithoutAnswer").html(html);

        if (didUserVote(result.d[k], userGuid) == false){
            html.html().replace("$AnswerUpVote", notVotedQuestion); 
        }

        panel.append(html);
        i++;


    }

}

初めて交換する部分はうまく機能しており、まさに私が望む方法です:

 var html = $("#OwnerTemplateQuestionWithoutAnswer").html().replace(/\$i/g, i)
                .replace(/\$AnswerSpan/g, result.d[k].Answers[0].Conetent)
                .replace(/\$answerGuid/g, result.d[k].Answers[0].Uid)
                .replace(/\$questionUid/g, result.d[k].Uid)
                .replace(/\$QuestionVote/g, result.d[k].QuestionVotes.length)
                .replace(/\$AnswerVotes/g, result.d[k].Answers[0].AnswerVotes.length)
                .replace(/\$textboxText/g, result.d[k].Content);

しかし、コードの後半で、いくつかの条件によって異なる方法で画像をロードする必要があります

   if (didUserVote(result.d[k], userGuid) == false){
        html.html().replace("$AnswerUpVote", notVotedQuestion); 
    }

そして、cideのこの部分はまったく機能しません...これを解決する方法、または何らかの方法で交換を改善する方法についての提案はありますか??

4

2 に答える 2

0

これを変える：

html.html().replace("$AnswerUpVote", notVotedQuestion);

これに：

var html = $("#OwnerTemplateQuestionWithoutAnswer");
html.html(html.html().replace("$AnswerUpVote", notVotedQuestion));

コードが機能しない理由は、最初のインスタンスで新しい Html を var html に割り当てているためです。後で、オブジェクトが既に作成されているため、その Html 値をそれ自体の更新された (置換/フィルター処理された) HTML コードに設定する必要があります。.html() を呼び出すと、参照ではなく値によって渡される文字列が取得されます。そのため、.html() を置き換えたときに、置き換えていましたが、結果に対して何もしていませんでした。 .

于 2012-10-06T19:56:39.870 に答える
0

上記の解決策を結論付けたかどうかはわかりませんが、mustache js を使用することを強くお勧めします。

Mustache は「ロジックのない」テンプレート構文です。「ロジックレス」とは、手続き型ステートメント (if、else、for など) に依存しないことを意味します。Mustache テンプレートは完全にタグで定義されます。

したがって、達成したいことを行うために、JavaScriptロジックを理解するのが難しい必要はありません。

Mustache.JS とそのテンプレートチュートリアルを確認してください。

于 2012-10-17T12:43:23.260 に答える