【问题标题】:How to write else for this script如何为这个脚本写 else
【发布时间】:2015-09-17 14:47:08
【问题描述】:

我正在为这个网站编码,并且 我需要在 pc-view 和 mobile-view 的两个脚本之间更改 javascript。 我在网上找到了这段代码,它确实在移动视图上加载了特定的脚本,但我想在 PC 上查看时切换到另一个。

因此,我需要知道如何编写以下脚本的“else”部分,以便加载“pc”版本。

<!--
if (navigator.userAgent.indexOf('iPhone') > 0 || navigator.userAgent.indexOf('iPad') > 0 || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0) {
//what u want to run in mobile devices 
var s = document.createElement("script");
s.type = "text/javascript";
s.src = "js/script_photo_sp.js";//file directory
document.getElementsByTagName("head")[0].appendChild(s);}
alert(s.src);//for running test purposes
//-->

任何帮助将不胜感激!

【问题讨论】:

  • 老实说,这里最简单的做法是使用 if 语句并针对在不同媒体查询时发生变化的 CSS 值进行测试。例如,如果您有一个 div,在移动设备上是 display:none,在桌面上是 display:block。测试该 div 是否显示:无 - 如果为 true,则运行移动功能,如果为 false(否则)运行桌面功能。显然,这个 div 可以是任何元素类或 ID。使用用户代理甚至屏幕尺寸的问题是这些可能不一致。基于 CSS 的响应式 JS 确保它们同时触发。希望这会有所帮助。
  • 另外 - 我对以下答案的问题是它们允许不一致,例如他们的代码在 Windows 手机上不起作用。
  • @Callum - 所有的优点 - 但问题不在于如何构建强大的设备检测..
  • @Stumblor 不,但问题是关于如何在脚本之间进行更改,我只是觉得使用 CSS 属性是一个整体上更简洁的解决方案,因为示例代码不适用于所有移动设备 ^ ^
  • 如果是这样的话,他最好内联检测浏览器功能,而不是换出脚本。 Modenizer 将是用于此目的的更好工具。 stackoverflow.com/questions/8500868/…

标签: javascript jquery html mobile responsive-design


【解决方案1】:

查找大括号,在这种情况下,在这一行的末尾

document.getElementsByTagName("head")[0].appendChild(s);} // end of condition
else {
   // else code goes here
}

【讨论】:

  • 感谢您的教育回答!我稍后会研究这个!
【解决方案2】:
    if (navigator.userAgent.indexOf('iPhone') > 0 || navigator.userAgent.indexOf('iPad') > 0 || navigator.userAgent.indexOf('iPod') > 0 || navigator.userAgent.indexOf('Android') > 0) {
        //what u want to run in mobile devices 
          var s = document.createElement("script");
          s.type = "text/javascript";
          s.src = "js/script_photo_sp.js";//file directory
          document.getElementsByTagName("head")[0].appendChild(s);
    } else {
      // code for pc here
    }
    alert(s.src);//for running test purposes

【讨论】:

  • 谢谢@Lunokhod!正是我需要的!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2015-10-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-11-06
  • 1970-01-01
  • 2011-11-17
相关资源
最近更新 更多