相关疑难解决方法(0)

Mediaelement.js:如何更改海报图片?

我正在尝试通过JS更改视频源.这主要是有效的.

var basename = "video/whatever";
$("#myvideo")[0].setSrc([
    {type: "video/mp4", src: basename + ".mp4"},
    {type: "video/webm", src: basename + ".webm"},
    {type: "video/ogg", src: basename + ".ogv"}
]);
Run Code Online (Sandbox Code Playgroud)

所以第一个问题:当我更改源时,暂停按钮显示而不是播放,并且即使暂停,也不会显示大的叠加播放按钮.我已经尝试在setSrc调用之前和之后发送stop()和pause()以及setCurrentTime(0)的各种组合,但没有运气.

更重要的问题:我还没有找到改变视频海报形象的方法.我期待在API中看到一个方法来更改它,因为我希望它也可以更新Flash/Silverlight后备.我尝试只更改视频元素上的poster属性,但似乎没有这样做.

javascript mediaelement.js

9
推荐指数
1
解决办法
3866
查看次数

等待ng-init值设置的正确方法是什么?

我的HTML中有一个" ng-init "指令,它在我的Angular.js数据模型中初始化" data.id " 的值.我们现在说,我无法改变其运作方式.

现在,我希望在页面加载后立即发出HTTP请求,其中URL将取决于此data.id值.到目前为止,以下似乎有效:

app.controller('MainCtrl', function ($scope, $http, $timeout) {
  "use strict";

  $scope.data = {};

  $timeout(function () {
    $http.get("/api/Something?id=" + $scope.data.id);
  }, 0);
});
Run Code Online (Sandbox Code Playgroud)

但是,使用超时为零的计时器似乎很笨拙.(如果我省略$ timeout代码并直接调用$ http.get,那么$ scope.data.id当然是未定义的).

在发出$ http请求之前,有没有更好的方法等待ng-init执行?以上基于超时的代码是否适用于所有情况/所有浏览器等?

angularjs angularjs-controller angularjs-timeout

9
推荐指数
1
解决办法
5926
查看次数

为什么这个基于setTimeout的代码在Firefox中没有超时(在Internet Explorer/Chrome中有效)?

我有以下代码,它演示了直接从事件触发器调用长时间运行的函数与使用的区别setTimeout().

预期行为:

  • 当按下第一个按钮时,它会显示为按下,计算运行几秒钟,然后当计算完成时,按钮再次按下,第二列从"尚未计算"变为"计算完成".(我不会详细说明为什么会发生这种情况; 它在相关答案中进行了解释.)

  • 按下第二个按钮时,按钮立即按下; 第二列立即更改为"正在计算..."文本.当计算在几秒钟后完成时,第二列从"计算..."变为"完成计算".

实际发生了什么:

  • 这在Chrome中完美运行(两个按钮都按预期运行)

  • 这在Internet Explorer 8中完美运行

  • 这在Firefox(第25版)中不起作用.具体来说,第二个按钮作为第一个按钮表现为100%.

    • 在更改超时setTimeout()01无影响

    • 在更改超时setTimeout()0500 作品

这让我有一个很大的难题.

根据为什么setTimeout()有效的原因,而缺少一个没有的原因,延迟对事物的运作方式应该没有影响,因为这里setTimeout()的主要目的是改变排队顺序,而不是拖延事情.

那么,为什么它不能在Firefox上使用延迟0或1,但按预期工作延迟500(并且适用于Internet Explorer 8/Chrome上的任何延迟)?

更新:除了下面的源代码,我还做了一个JSFiddle.但由于某些原因,JSFiddle甚至拒绝加载我的Internet Explorer 8,因此对于该测试,需要以下代码.

更新2:有人提出了dom.min_timeout_valueFirefox中配置设置问题的可能性.我已将其编辑为4到0,重新启动浏览器,并且没有修复任何内容.它仍然失败,超时为0或1,成功为500.


这是我的源代码 - 我只是将其保存到C:驱动器上的HTML文件中,并在所有三个浏览器中打开:

<html><body>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

<table border=1>
    <tr><td><button id='do'>Do long calc - bad status!</button></td>
        <td><div id='status'>Not Calculating yet.</div></td></tr>
    <tr><td><button id='do_ok'>Do long calc - good status!</button></td>
        <td><div id='status_ok'>Not Calculating yet.</div></td></tr> …
Run Code Online (Sandbox Code Playgroud)

html javascript firefox cross-browser settimeout

8
推荐指数
1
解决办法
2730
查看次数

将回调添加到在web.list.Column的子类中创建的DOM元素

我正在尝试修改web_tree_image小部件.我希望在悬停或点击时显示更大的图像,而不是仅在列中显示小图像.为了实现这一点,我试图通过覆盖start函数来渲染窗口小部件后添加回调,如文档所述.

因此,我将以下代码添加到web_tree_image.js:

openerp.web_tree_image = function (instance) {
    instance.web.list.Image = instance.web.list.Column.extend({
        // [...]
        start: function() {
            console.log("start called");
            // [... add callbacks ...]
        },
        // [...]
    });
};
Run Code Online (Sandbox Code Playgroud)

但是,start从不调用该函数,因此这不起作用.

我还没有完全理解通常会start被调用的代码路径,但似乎它在某种程度上是不同的web.list.Column.

应该start打电话给我,我做错了什么?或者在创建DOM元素之后还有另一种执行代码的方法吗?

javascript callback openerp openerp-8 odoo-8

7
推荐指数
1
解决办法
480
查看次数

setTimeout(fun)只有一个参数?(未指定超时)

HTML5 规范,各国setTimeout可以在不这是应该经过多少毫秒将函数"处理程序"被安排说额外的"超时"的说法来运行.

handle = window . setTimeout( handler [, timeout [, arguments ] ] )
   Schedules a timeout to run handler after timeout milliseconds. Any arguments are passed straight through to the handler.
Run Code Online (Sandbox Code Playgroud)

但是,我没有找到解释当没有设置"超时"时间段时会发生什么的任何地方.

一个示例用法是Raphael库中的动画实现.

animationElements[length] && win.setTimeout(animation);
Run Code Online (Sandbox Code Playgroud)

javascript settimeout

6
推荐指数
1
解决办法
3709
查看次数

Javascript是这些调用在Node.js中是一样的吗?

我想知道这两个代码块在Node.js中是否相同?

// Style 1
setTimeout(function () {
  console.log('hello');
}, 0);


// Style 2
console.log('hello');
Run Code Online (Sandbox Code Playgroud)

从上面开始我0超时,应该没有等待时间.它是否与console.log('hello');不使用setTimeout直接调用相同?

javascript node.js express

6
推荐指数
1
解决办法
166
查看次数

setTimeout - 奇怪的行为

请考虑以下HTML:

<html>
    <head></head>
    <body>
        <input type="text" onblur="window.setTimeout('document.title += 2;', 0);" />
        <input type="button" onclick="document.title += 1" />
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

[ 0延迟演示,100ms延迟,150ms延迟 ]

并执行以下步骤:

  • 用户输入输入(焦点).
  • 用户单击该按钮.

现在,事件将按以下顺序发生:

  • 输入文字模糊事件.
  • 按钮单击事件.

在我得到的所有可访问的浏览器上测试:

document.title = '21' //Expected behavior
Run Code Online (Sandbox Code Playgroud)

但!在生产浏览器(Windows XP + IE 7)上,我得到:

document.title = '12' //Unexpected behavior
Run Code Online (Sandbox Code Playgroud)

我也尝试在我的本地机器(IE 10)上以IE 7模式模拟它,无法重现它.

这显然是我遇到的问题的简化示例.否则我可以简单地摆脱setTimeout.

在实际场景中,setTimeout调用实际上是由第三方脚本库(ASP.NET Dev Express组件)进行的.

除了这个问题的实际解决方案(我认为我可以处理),可以对这种行为应用什么解释?

更新:

使用表达式new Date().getTime()获取浏览器执行的每个步骤的时间.它发生如下:

1387369361417 //document.title += 1
1387369361433 //document.title += 2
Run Code Online (Sandbox Code Playgroud)

javascript settimeout

6
推荐指数
1
解决办法
315
查看次数

如果不查询宽度属性,则转换不起作用

我想通过在js中为div添加一个类来为clickX设置转换动画.转换和转换属性将添加到css文件中.

var widget = document.getElementById('widget');    
widget.style.display = 'block';
document.getElementById('widget2').clientWidth; //comment this line out and it wont work
widget.className = 'visible';
Run Code Online (Sandbox Code Playgroud)

它只有在我添加类之前查询dom 中任何元素的width属性时才有效.

这是一个jsfiddle:https://jsfiddle.net/5z9fLsr5/2/

任何人都可以解释为什么这不起作用?

javascript css3 css-transitions css-transforms

6
推荐指数
1
解决办法
69
查看次数

了解hashchange事件的执行顺序

关于此代码段,我有一个问题:

window.location.hash=1;

$(window).on('hashchange', function() {
    alert('hello');
});
Run Code Online (Sandbox Code Playgroud)

上面的脚本应该这样做:

  1. 将位置哈希设置为 1
  2. 任何进一步的变化 - > alert('hello')

这是问题:为什么 hashchange在第一次执行时第一次调用?这个脚本不应该只更改哈希而没有任何警报吗?

如何修复它以使其按照描述工作?

javascript jquery

6
推荐指数
2
解决办法
564
查看次数

尝试使用 JavaScript 触发 CSS 转换

在使用 JavaScript 和 CSS 转换时,我尝试使用 JavaScript 和 innerHTML 动态插入 div 后立即删除 CSS 类。

我真的很惊讶地发现与蓝色 div 的不透明度相关的 CSS 转换没有按照我想要的方式触发(在 Safari 下工作,在 Chrome 下随机工作,在 Firefox Dev Edition 下不起作用)。有人可以解释这种现象吗?

我不确定为什么它的工作方式与红色 div 的工作方式不同。也许我不知道浏览器如何处理 innerHTML ?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Having fun with JS</title>
    <style>
        .std {
            width:100px;
            height:100px;
            opacity: 1;
            transition: opacity 5s;
        }

        .std--hidden {
            opacity: 0;
        }

        .std--red {
            background-color: red;
        }

        .std--blue {
            background-color: blue;
        }
    </style>
</head>
<body>
<button>click here</button>
<div class='std std--red std--hidden'></div>
<div class='insert-here'>
</div> …
Run Code Online (Sandbox Code Playgroud)

javascript css innerhtml listener css-transitions

6
推荐指数
1
解决办法
2698
查看次数