标签: cross-browser

JSON.stringify在IE10中不起作用

我正在尝试解析一些表单数据以生成要在ajax请求中发送的JSON数据.以下HTML是我的代码的过度简化版本.我正在使用APS.Net MVC4,我的渲染视图生成以下HTML:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="/Content/site.css" rel="stylesheet"/>
    <script src="/Scripts/modernizr-2.6.2.js"></script>
</head>
<body>

<div class="test-class" data-my-attribute="1"></div>
<div class="test-class" data-my-attribute="2"></div>
<div class="test-class" data-my-attribute="3"></div>

<script src="/Scripts/jquery-1.8.2.js"></script>

<script type="text/javascript">
    $(function () {
        jsonObj = [];
        $(".test-class").each(function () {
            var myAttribute = $(this).data('my-attribute');
            item = {}
            item["MyAttribute"] = myAttribute;
            jsonObj.push(item);
        });
        var data = { SomeOtherData: 1234, MyAttribs: jsonObj };
        console.log(JSON.stringify(data));
    });
</script>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

在Chrome中,控制台中的输出按预期输出...

{
    "SomeOtherData": 1234,
    "MyAttribs": [{
        "MyAttribute": 1
    }, {
        "MyAttribute": …

Run Code Online (Sandbox Code Playgroud)

javascript jquery internet-explorer json cross-browser

Gav*_*and

2013 11-19

1
推荐指数

1
解决办法

3795
查看次数

display:table&display:table-cell在IE9中不起作用

萨拉姆(意为你好):)

我正在尝试使用display:table&为我的网页实现3列布局display:table-cell.它在firefox和chrome中运行良好,我知道IE 9中应该支持这个功能,但到目前为止我所做的只不过是这个截图:

在此输入图像描述

我怎样才能在IE 8+中使用它？

这是我的完整代码:

(JS小提琴可用)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN">
<html>
<head>
    <title>test</title>
    <meta http-equiv="Content-Type" Content="text/html;charset=UTF-8">
    <style type="text/css">
        *{
            margin: 0;
            padding: 0;
        }
        html,body{
            width:100%;
            margin:0;
            padding:0;
        }
        .container{
            display:table;
            width:100%;
            border-collapse:separate;
        }
        .col{
            display:table-cell;
        }
        .side-1{
            width:200px;
            background: #efefef;
        }
        .side-2{
            width:200px;
            background: #f8f8f8;
        }
        .content{

        }
        #header,#footer{
            height:40px;
            background: #e4f3fd;
        }
    </style>
</head>
<body>
<div id="header">header</div>
<div class="container">
    <div class="col side-1">
        sidebar 1
        <br>.<br>.<br>.
    </div> …

Run Code Online (Sandbox Code Playgroud)

html css internet-explorer cross-browser

Nas*_*ade

lucky-day

1
推荐指数

1
解决办法

2万
查看次数

使用JSON对象与localStorage/sessionStorage/IndexedDB/WebSQL /等.

我有一个网络应用程序,可以在启动时获取几十个项目.所有这些项目都是JSON,小于1kb.

现在有许多存储选项,如问题所示.

我在考虑将这些对象存储在浏览器JS中的变量中.我真的不明白为什么我要使用这些浏览器存储？

那么在JS中使用任何基于浏览器的存储而不是变量的原因是什么.可能是从某个数据大小开始,最好使用浏览器存储,例如从100kb开始,最好不要使用JS变量.

var myModel = {}

注意

每次用户输入应用程序时,他都会从服务器获取新鲜内容.内容对于缓存来说太实时了.`

javascript browser json cross-browser local-storage

xrD*_*DDD

2014 02-16

1
推荐指数

1
解决办法

3684
查看次数

在safari中的字体渲染问题

嗨,目前我正在制作一个WordPress主题,其中主题的首页在所有浏览器上看起来不错,但在野生动物园,当我们去任何其他页面标题的页面有标题,标语和右侧有小菜单和联系方式有线意味着它的字体比首页更轻,我需要在所有页面上保持一致.

主题网址在这里

请在野生动物园看到

Frontpage - http://demo.wpgothemes.com/minn

你可以看到任何其他页面,例如 - http://demo.wpgothemes.com/minn/page-layouts/3-col-content-center/

谢谢Vishal

css safari cross-browser

Vis*_*iya

lucky-day

1
推荐指数

1
解决办法

2865
查看次数

跨浏览器解决方案，删除浏览器默认焦点样式

有没有跨浏览器的方法来删除浏览器样式的焦点元素？

如果不是，最常用的浏览器采用哪些样式？

html css browser focus cross-browser

die*_*tin

lucky-day

1
推荐指数

1
解决办法

2136
查看次数

使用javascript检测用户浏览器

我使用以下代码来发现用户浏览器:

navigator.appName == "Microsoft Internet Explorer"

Run Code Online (Sandbox Code Playgroud)

它总是奏效,但IE11正在回归 Netscape

我读过浏览器检测是一种不好的做法.(为什么JavaScript navigator.appName会为Safari,Firefox和Chrome返回Netscape？),我们应该检测功能.但MS 的网站正在教我如何检测IE浏览器.

在IE11中,即使是userAgent也会提到IE:

Mozilla/5.0(Windows NT 6.3; WOW64; Trident/7.0; .NET4.0E; .NET4.0C; InfoPath.3; .NET CLR 3.5.30729; .NET CLR 2.0.50727; .NET CLR 3.0.30729; rv :11.0)像Gecko

这是说:

知道我必须使用什么的正确方法是什么？

例如,如果我使用IE,则命令为:

window.document.execCommand('Stop');

Run Code Online (Sandbox Code Playgroud)

否则,命令是

window.stop()

Run Code Online (Sandbox Code Playgroud)

搭便车,了解浏览器是否支持HTML5的正确方法是什么？

javascript html5 cross-browser

Niz*_*zam

2017 05-23

1
推荐指数

1
解决办法

397
查看次数

CSS calc()的跨浏览器替代方案

calcOpera mini和IE 8不支持CSS 方法.但这是一个必不可少的方法,我无法想象这些浏览器不存在等效的东西.

是否有一种普遍支持的方式,我可以完成一个有填充的div,但也填充整个屏幕？或者有没有办法让这个代码跨浏览器？

HTML

<div class="this-should-fill-the-whole-screen"></div>

Run Code Online (Sandbox Code Playgroud)

CSS

.this-should-fill-the-whole-screen {
  padding: 20px;
  width: calc(100% - 40px);
  height: calc(100vh - 40px);
}

Run Code Online (Sandbox Code Playgroud)

小提琴:http://jsfiddle.net/wfq6xLn5/

html css cross-browser calc

Joe*_*ano

lucky-day

1
推荐指数

1
解决办法

3396
查看次数

Mozilla Firefox输入单选按钮样式和默认设置

form我的页面上有各种元素，但是Firefox中的输入单选按钮有问题。单选按钮在Safari和Chrome中可以完美显示，但在Firefox中完全不同（圆形而不是正方形！），并且默认情况下已选中：，这也是一个问题。

从我的研究中，广泛建议使用-moz-appearance，但是在这种情况下，我找不到与我的查询直接相关的任何答案。任何帮助将不胜感激。

标记

<form>
    <label class="radio" for="#">One</label>
    <input type="radio">
    <label class="radio" for="#">Two</label>
    <input type="radio">
</form>

Run Code Online (Sandbox Code Playgroud)

的CSS

input[type="radio"] {
    -webkit-appearance: none; /* Remove default appearance styling for Webkit */
    -moz-appearance: none; /* Remove default appearance styling for Firefox */
    background: #ccc;
    width: 45px;
    height: 45px;
    vertical-align: middle;
    margin: 0 10px;
    cursor: pointer;
}

input[type="radio"]:hover { background: #e4e4e4; }

input[type="radio"]:checked {
    background: #000;
    position: relative;
    width: 45px;
    height: 45px;
}

input[type="radio"]:checked:after {
    content: '';
    position: absolute;
    width: 20px;
    height: 8px;
    background: …

Run Code Online (Sandbox Code Playgroud)

css forms firefox cross-browser

dun*_*140

lucky-day

1
推荐指数

1
解决办法

1万
查看次数

为什么我的搜索栏中的占位符文本没有出现在Firefox中

我有一个跨浏览器问题,其中嵌套在我的Rails应用程序的搜索栏中的占位符文本不会出现在Mozilla中,尽管在所有其他浏览器中工作都很棒.

我没有成功地四处寻找答案.

搜索栏在Safari,Chrome和Opera中呈现.

使用Firefox呈现的搜索栏.

_header.html.erb

<nav class="navbar navbar-static-top navbar-default" role="navigation">
  <div class="container">
  <!-- Brand and toggle get grouped for better mobile display -->
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
      <span class="sr-only">Toggle navigation</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="/">
      <%= image_tag('nippon.svg', alt: "Nippon Beauty", class: "navbar-brand-icon") %>
    </a> 
  </div>

      <input type="text" class="searchTerm" placeholder="What type of Skincare product would you like?">

  <!-- Collect the nav links, forms, and other content for toggling -->
  <div class="collapse navbar-collapse navbar-ex1-collapse"> …

Run Code Online (Sandbox Code Playgroud)

html css ruby-on-rails cross-browser placeholder

Chr*_*ani

2016 06-15

1
推荐指数

1
解决办法

2018
查看次数

Math.random()和.replace()跨浏览器

我最近写了代码,随机生成10个字符.Math.random()给出一个小数toString(36),所有数字都将被替换.

Math.random().toString(36).replace(/[^a-z]+/g,'').substr(1,10);

Run Code Online (Sandbox Code Playgroud)

有没有人暗示为什么Firefox(47.0)和Chrome(51)不能同等地处理这个问题？

Chrome测试:

Math.random().toString(36).replace(/[^a-z]+/g,'').substr(1,10);
"spkcirhyzb"
"gcqbrmulxe"
"sallvbzqbk"
"pcdcufhqet"
"knfffqsytm"

Run Code Online (Sandbox Code Playgroud)

Firefox测试:

Math.random().toString(36).replace(/[^a-z]+/g,'').substr(1,10);
"zxntpvn"
"hebfyxlt"
"zclj"
"ormtqw"
"cfbsnye"

Run Code Online (Sandbox Code Playgroud)

实时版:

for (var n = 0; n < 5; ++n) {
  console.log(Math.random().toString(36).replace(/[^a-z]+/g,'').substr(1,10));
}

Run Code Online (Sandbox Code Playgroud)

UPDATE(字符串平均值):

var test;
  var count = 0;
  for (var n = 0; n < 1000; ++n) {
      test = Math.random().toString(36).replace(/[^a-z]+/g,'').substr(1,10);
      count += test.length;
  }
  console.log(count);
  console.log(count/1000);

Run Code Online (Sandbox Code Playgroud)

我的结果:

Chrome - 9.999

Firefox - 6.794

javascript random cross-browser

tro*_*xup

2016 06-29

1
推荐指数

1
解决办法

325
查看次数