Question

所以我有一个Jquery if语句，它使用$(".library-content").html("Here is some content!")在div中显示不同的内容，但我希望显示的内容部分依赖于变量。因此，如果变量设置为“猫”，内容可能会显示为“我喜欢猫”，如果变量变为“狗”，则会显示“我喜欢狗”。可能吗？

这是我的代码，它很长，所以我试图在我的例子中缩短它，

 var librarycat = 'none' ;
 var librarytype = 'none' ;

$( document ).ready(function() {
$("#library-cat").change(function() {
  librarycat = $('option:selected',this).val(); 
  if(librarycat != 'none' && librarytype != 'none') {
        $(".library-content").html("{% set topic_posts = blog_recent_topic_posts('2941362257', 'audio', 25 ) %}<ul class='test-list'>{% for post in topic_posts|unique('name') %}{% if 'audio' in post.topic_list|map(attribute='name') %}<li><a href='{{post.absolute_url}}'><img src='{{ post.post_list_summary_featured_image }}' class='hs-featured-image'>{{ post.name}}</a><br>{% for topic in post.topic_list %}<a class='topic-link' href='{{ group.absolute_url }}/topic/{{ topic.slug }}'>{{ topic.name }}</a>{% if not loop.last %} {% endif %}{% endfor %}</li>{% endif %}{% endfor %}</ul>");
}
else if(librarycat == 'none' && librarytype != 'none') {
    $(".library-content").html("{% set topic_posts = blog_recent_topic_posts('2941362257', 'audio', 25 ) %}<ul class='test-list'>{% for post in topic_posts|unique('name') %}<li><a href='{{post.absolute_url}}'><img src='{{ post.post_list_summary_featured_image }}' class='hs-featured-image'>{{ post.name}}</a><br>{% for topic in post.topic_list %}<a class='topic-link' href='{{ group.absolute_url }}/topic/{{ topic.slug }}'>{{ topic.name }}</a>{% if not loop.last %} {% endif %}{% endfor %}</li>{% endfor %}</ul>")
}
else if(librarycat != 'none' && librarytype == 'none') {
    $(".library-content").html("{% set topic_posts = blog_recent_topic_posts('2941362257', 'audio', 25 ) %}<ul class='test-list'>{% for post in topic_posts|unique('name') %}<li><a href='{{post.absolute_url}}'><img src='{{ post.post_list_summary_featured_image }}' class='hs-featured-image'>{{ post.name}}</a><br>{% for topic in post.topic_list %}<a class='topic-link' href='{{ group.absolute_url }}/topic/{{ topic.slug }}'>{{ topic.name }}</a>{% if not loop.last %} {% endif %}{% endfor %}</li>{% endfor %}</ul>")
}
else {
    $(".library-content").html("{% set topic_posts = blog_recent_topic_posts('2941362257', 'audio', 25 ) %}<ul class='test-list'>{% for post in topic_posts|unique('name') %}{% if 'Insurance' in post.topic_list|map(attribute='name') %}<li><a href='{{post.absolute_url}}'><img src='{{ post.post_list_summary_featured_image }}' class='hs-featured-image'>{{ post.name}}</a><br>{% for topic in post.topic_list %}<a class='topic-link' href='{{ group.absolute_url }}/topic/{{ topic.slug }}'>{{ topic.name }}</a>{% if not loop.last %} {% endif %}{% endfor %}</li>{% endif %}{% endfor %}</ul>")
     }
 });

你看到'audio'这个词，我希望这取决于select元素。

Answer 1

因为你在城里新人，我会帮助你。将来，请查看帮助页面并提供一些代码。

if (firstThing === firstThing) {
    var myString = "Some words";

    if (secondThing) {
        myString = myString + "are pretty cool";
    }

    $(".library-content").html(myString);
}

Answer 2

使用if语句和局部变量来设置消息。 .html()函数的输入可以是变量或静态文本。

$().ready(function() {
    var useCats = false;
    var catsMessage = "I Like Cats";
    var dogsMessage = "I Like Dogs";
    if(useCats)
      $(".library-content").html(catsMessage);
    else
      $(".library-content").html(dogsMessage);
});

＆＃13;

$().ready(function() {
  var useCats = false;
  var catsMessage = "I Like Cats";
  var dogsMessage = "I Like Dogs";
  if(useCats)
    $(".library-content").html(catsMessage);
  else
    $(".library-content").html(dogsMessage);
});

＆＃13;

.library-content {
  border: 1px solid red;
  width: 200px;
  text-align: center;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="library-content">Original Content</div>

＆＃13;

在.html（）函数中使用Jquery变量

2 个答案: