Question

我的短段以＆＃34; FIND OUT MORE＆＃34;。

结尾

所以onclick我想将一些带有图片的文字添加到div。

这是我正在做的事情，这是我的JS：

function appendText() {
    var txt = '<div class="accomodations">
                    <h3>Одноместный номер</h3>
                    <ul>
                        <li><img src="img/living1-1.jpg" alt=""></li>
                        <li><img src="img/living1-2.jpg" alt=""></li>
                        <li><img src="img/living1-3.jpg" alt=""></li>
                    </ul>   
                    <p>Стоимость: 3000грн/заезд</p>
                </div>

                <div class="accomodations">
                    <h3>Двуместный номер</h3>
                    <ul>
                        <li><img src="img/living2-1.jpg" alt=""></li>
                        <li><img src="img/living2-2.jpg" alt=""></li>
                        <li><img src="img/living2-3.jpg" alt=""></li>
                    </ul>
                    <p>Стоимость: 2500грн/заезд</p>
                </div>

                <div class="accomodations">
                    <h3>Трехместный номер</h3>
                    <ul>
                        <li><img src="img/living3-1.jpg" alt=""></li>
                        <li><img src="img/living3-2.jpg" alt=""></li>
                        <li><img src="img/living3-3.jpg" alt=""></li>
                    </ul>
                    <p>Стоимость: 2000грн/заезд</p>
                </div>'';'

    $("#livingbg").append(txt);
}

这是我的HTML：

<a href="" onclick="appendText()">Find out more...</a>

Answer 1

对于多行字符串，您需要将var txt = '<div class="accomodations">\ <h3>Одноместный номер</h3>\ <ul>\ <li><img src="img/living1-1.jpg" alt=""></li>\ <li><img src="img/living1-2.jpg" alt=""></li>\ <li><img src="img/living1-3.jpg" alt=""></li>\ </ul> \ <p>Стоимость: 3000грн/заезд</p>\ </div>\ \ <div class="accomodations">\ <h3>Двуместный номер</h3>\ <ul>\ <li><img src="img/living2-1.jpg" alt=""></li>\ <li><img src="img/living2-2.jpg" alt=""></li>\ <li><img src="img/living2-3.jpg" alt=""></li>\ </ul>\ <p>Стоимость: 2500грн/заезд</p>\ </div>\ \ <div class="accomodations">\ <h3>Трехместный номер</h3>\ <ul>\ <li><img src="img/living3-1.jpg" alt=""></li>\ <li><img src="img/living3-2.jpg" alt=""></li>\ <li><img src="img/living3-3.jpg" alt=""></li>\ </ul>\ <p>Стоимость: 2000грн/заезд</p>\ </div>';添加到每行的末尾：

UserId Count(1's),Count(2's) Count(3's)

 1. 1001     10      8         2 
 2. 1002     5      10        3

Answer 2

SELECT *
  FROM [CMS_DocumentAlias]
  WHERE [AliasNodeID] IN (SELECT NodeID  FROM [CMS_Tree]
  WHERE [NodeAliasPath] LIKE '/Products/%' /*AND NodeSiteID=...*/)

使用这种方式可以使代码更好地理解。

Answer 3

你可以这样做：

function Convert(f) {
    return f.toString().
        replace(/^[^\/]+\/\*!?/, '').
        replace(/\*\/[^\/]+$/, '');
}

var sample=Convert(function() {/* Add what ever you want here */})

https://jsfiddle.net/wrhjj04f/

通过这种方式，您不必担心任何引号，双引号，新行......，只需将您的文字放在评论中。

 function Convert(f) {
        return f.toString().
            replace(/^[^\/]+\/\*!?/, '').
            replace(/\*\/[^\/]+$/, '');
    }

    var sample=Convert(function() {/*
    <div class="accomodations">
                    <h3>Одноместный номер</h3>
                    <ul>
                        <li><img src="img/living1-1.jpg" alt=""></li>
                        <li><img src="img/living1-2.jpg" alt=""></li>
                        <li><img src="img/living1-3.jpg" alt=""></li>
                    </ul>   
                    <p>Стоимость: 3000грн/заезд</p>
                </div>

                <div class="accomodations">
                    <h3>Двуместный номер</h3>
                    <ul>
                        <li><img src="img/living2-1.jpg" alt=""></li>
                        <li><img src="img/living2-2.jpg" alt=""></li>
                        <li><img src="img/living2-3.jpg" alt=""></li>
                    </ul>
                    <p>Стоимость: 2500грн/заезд</p>
                </div>

                <div class="accomodations">
                    <h3>Трехместный номер</h3>
                    <ul>
                        <li><img src="img/living3-1.jpg" alt=""></li>
                        <li><img src="img/living3-2.jpg" alt=""></li>
                        <li><img src="img/living3-3.jpg" alt=""></li>
                    </ul>
                    <p>Стоимость: 2000грн/заезд</p>
                </div>

 */})

                       alert(sample);

Answer 4

＆＃13;

function appendText(e) {
    var strVar = "";
    strVar += "<div class=\"accomodations\">";
    strVar += "                    <h3>Одноместный номер<\/h3>";
    strVar += "                    <ul>";
    strVar += "                        <li><img src=\"img\/living1-1.jpg\" alt=\"\"><\/li>";
    strVar += "                        <li><img src=\"img\/living1-2.jpg\" alt=\"\"><\/li>";
    strVar += "                        <li><img src=\"img\/living1-3.jpg\" alt=\"\"><\/li>";
    strVar += "                    <\/ul>   ";
    strVar += "                    <p>Стоимость: 3000грн\/заезд<\/p>";
    strVar += "                <\/div>";
    strVar += "";
    strVar += "                <div class=\"accomodations\">";
    strVar += "                    <h3>Двуместный номер<\/h3>";
    strVar += "                    <ul>";
    strVar += "                        <li><img src=\"img\/living2-1.jpg\" alt=\"\"><\/li>";
    strVar += "                        <li><img src=\"img\/living2-2.jpg\" alt=\"\"><\/li>";
    strVar += "                        <li><img src=\"img\/living2-3.jpg\" alt=\"\"><\/li>";
    strVar += "                    <\/ul>";
    strVar += "                    <p>Стоимость: 2500грн\/заезд<\/p>";
    strVar += "                <\/div>";
    strVar += "";
    strVar += "                <div class=\"accomodations\">";
    strVar += "                    <h3>Трехместный номер<\/h3>";
    strVar += "                    <ul>";
    strVar += "                        <li><img src=\"img\/living3-1.jpg\" alt=\"\"><\/li>";
    strVar += "                        <li><img src=\"img\/living3-2.jpg\" alt=\"\"><\/li>";
    strVar += "                        <li><img src=\"img\/living3-3.jpg\" alt=\"\"><\/li>";
    strVar += "                    <\/ul>";
    strVar += "                    <p>Стоимость: 2000грн\/заезд<\/p>";
    strVar += "                <\/div>";

    $("#livingbg").append(strVar);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" onClick="appendText();">Find out more...</a>

<div id="livingbg"><div>

＆＃13;

HTML JS转换助手：http://www.accessify.com/tools-and-wizards/developer-tools/html-javascript-convertor/

用JQuery添加几个DIV

4 个答案: