javascript - 如何向同一个 View 添加多个CSS样式

标签 javascript html css

我正在为我的应用程序使用Kendo mobile,我需要向我的 View 添加多个类,当PostedImageUrl不为空时,我需要添加一些基于UI的类,当PostedImageUrl 为空,我需要更改 UI,我如何实现这一点,请提出建议。

  <div data-role=view>
  <ul class="oneClass"  data-role="listview" id="Feeds-listview" data -bind="foreach:data">
  <li style="background-color:#FFF;white-space:normal">
  <div style="width:100%">
  <label  class="profile-username front" data-bind="text:username"></label>
   <div style="float:left">
     <span data-bind="text:userId" style="display:none"></span>
   <div style="padding:0px!important">
    <img class="profileimage fimage" data-bind="attr: { src:ImageSrc }"  />
  </div>
   </div>
 <div style="float:left">
  <img class="emoji" data-bind="attr: { src: emoji }" />
  </div>
   <input type="checkbox" class="listcheckbox "/>
  <div data-bind="if:delete" class="delete">
   <a href="#" id="delete" data-bind="click:$root.Delete"><img 
   src="images/bin.png" style="width:24px;height:24px;float:right;margin-
   top:10px;" class="front" /></a> 
 </div>
 </div>
  <div >
    <span data-bind="text:PostedImageID"></span>
         <img style="height: 200px;width: 300px;margin-top: 10px;" data-
      bind="attr: { src:PostedImageUrl }" />
   </div>
           <div data-bind="click:$root.Like" class="Like" >
      </div>
          <a href="#" data-
      bind="click:$root.open"class="two"style="float:right;margin-top:47px">
     <span class="count" data-bind="text:TotalCount"></span>
                          top:-10px" />
  </span>
  </a>
  <span class="" data-bind="text:createdAt"></span>
 </li>
 </ul>
 <div>

最佳答案

也许可以尝试一下,使用 $("img").on("load", function() { .. }

$(document).ready(function() {

  $("img").on("load", function() {
    alert('SRC updated!: ' + $(this).attr("src"));
  });

});

示例:

http://jsfiddle.net/b4ujn03w/3/

$(document).ready(function() {
  $("img").on("load", function() {
    alert('SRC updated!: ' + $(this).attr("src"));
  });

  setTimeout(function() {
    $("img").attr("src", "http://images2.fanpop.com/images/photos/5700000/Random-random-5719763-1280-800.jpg");
  }, 1000);

  setTimeout(function() {
    $("img").attr("src", "https://dummyimage.com/600x400/000/fff");
  }, 3000);


});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img src='http://images5.fanpop.com/image/photos/30800000/-Random-random-30843841-1920-1080.jpg' />

关于javascript - 如何向同一个 View 添加多个CSS样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43640025/

相关文章:

JQuery slideToggle - 改变文本

javascript - chop 文本以适应 3 行并在 Html 中显示三个点

html - 如何用搜索按钮替换 'Enter key' 搜索

javascript - 从数组生成 strip 索引 block

javascript - 尝试使用 $compileProvider、CRUD 和引导指令 ng-clink 失败

Javascript localStorage 以相反顺序显示

javascript - 动态改变字体大小

javascript - 执行canvas.toDataUrl()时出现空白图像

jquery - 仅将文本颜色添加到 HTML 推文的主题标签

css - Opera 中的 SVG 使用 CSS 背景图像缩放