标签: javascript-events

我使用可编辑的div,

<div class="editableDiv"  contenteditable="true">
   sdtgssdrsdrtyy ?asasasarrstssdertrtyrtyrrty ?aaaaaaaaaaaaaaaaadaafsdsf4n
</div>

我有任务向用户显示nonascii字符,hilight nonascii字符我使用了hilighting jquery库,通过添加带有"hilight"类的span来突出显示nonascii字符.innerHTML如下......

<span class="highlight">?</span>asasasarrstssdertrtyrtyrrty
<span class="highlight">?</span>aaaaaaaaaaaaaadaafsdsf4n

突出显示效果很好,但只出现问题是当用户删除nonascii字符并从该位置开始输入时,键入的字符也会变为高亮,当我检查innerHTML时,它显示新键入的字符也进入span标记,如下所示. .

<span class="highlight">?aaa</span>aaaaaaaaaaaaaadaafsdsf4n

为了解决这个问题,我在可编辑的div上使用了"KeyUp"事件,在这种情况下,我使用nonascii字符和新类型的字符分隔并将它们放入新的span标记并重新复制旧的.这适用于第一个密钥并且新输入的字符也没有突出显示但在此之后当我再次键入时,此事件不会触发.

我不知道导致这个的原因是什么？这是因为我明确改变了div的innerHTML吗？请帮助.....

以下是键盘功能....

$(document).on('keyup', ".editableDiv", function () {

        var hilighterSpans = $(this).children(".highlight");

        hilighterSpans.each(function (x, y) {

            var spanText = $(y).text().trim();

            if (spanText == "") {
                $(y).remove();
            }
            else {

                var regex = new RegExp("[^\u0020-\u007E]+");
                var nonasciiChar = regex.exec(spanText);

                if (nonasciiChar != "") {

                    var asciiChars = spanText.replace(nonasciiChar, '');

                    var spannode1 = document.createElement('span');

                    var spannode2 = document.createElement('span');
                    spannode2.className = 'highlight';
                    spannode2.innerHTML=nonasciiChar;

                    if …

我想在click函数中传递参数.

var albums = document.getElementsByClassName("album");
for(var i = 0; i<albums.length; i++){
    document.getElementById(albums[i].id).addEventListener("click", goAlbum(albums[i].id), false);
}

但是,函数"goAlbum"在创建时会被激活,然后函数将不再执行.我究竟做错了什么？

我正在通过DOM元素注册一个点击监听器jQuery.on().如果稍后将该元素从DOM中删除 - 可能是间接的,例如通过替换某些父级的内容$(parent).html(...),我是否仍然需要通过删除我的处理程序jQuery.off()？

即使该元素不再触发任何事件,我担心潜在的内存泄漏.一旦元素从DOM中删除,jQuery或浏览器是否会处理并丢弃所有已注册的处理程序？

内部对象构造函数:

this.notification.addEventListener(barcodeScanner.NEW_READING, this.handleBarcode.bind(this));

当它失败时:

this.notification.removeEventListener(barcodeScanner.NEW_READING, this.handleBarcode.bind(this), this);

我可以添加事件监听器并正常工作,但是当对象销毁时我无法删除单个事件监听器.

虽然它与问题没有多大关系,但我使用的是EventDispatcher.js和Class.js.

我可以修改EventDispatcher.js中的代码以满足我的需要.但是如何在不删除所有其他侦听器的情况下删除objcet函数的事件侦听器？

有没有办法创建一个没有取消按钮的输入提示框,或者在输入某个值之前不允许用户关闭提示？

我知道这已经在这里,那里和那里被问到了.

在我努力寻找合适的组合时,基于这些答案,我想我会在这里总结一下,所以我们都能更清楚,更容易地找到它.

所以我有一段像HTML一样的

<form action="/AssetBundle/DownloadFile" data-ajax="true" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#masterLinkHolder" id="form0" method="post"></form>
  <table>
      <tr>
          <td>someimage.png</td>
          <td><img src="imageicon.png"></td>
          <td><button type="button">Click to Download</button></td>
      </tr>
      <tr>
          <td>somedocument.docx</td>
          <td><img src="docicon.png"></td>
          <td><button type="button">Click to Download</button></td>
      </tr>
  </table>
  <input type="hidden" id="file2Download" />
</form>

并且当button被点击我想设置value与输入的id file2Download是文件名(如someimage.png,somedocument.docx从同)tr为按钮,然后提交表单.所以我需要填写帮助

<script type="text/javascript">
    $('button').click(function () {
        $('#file2Download').val(
           // ... ?
        );
        $('#id0').submit();
    });
</script>

以适当的方式.我知道我正在看一棵树

               tr
           /   |    \ 
          td   td    td
               |      \
              img     button

并试图从button祖父母那里去tr,然后再到第一个孩子tr.

我有两个下拉菜单.当我在第一个下拉列表中选择一个选项时,第二个下拉列表值将根据第一个下拉列值进行更改.

HTML代码

<select id="one">
    <option value="a">A</option>
    <option value="b">B</option>
</select>
<select id="two">
    <option value="a">A</option>
    <option value="b">B</option>
</select>

JS代码

$("#one").change(function () {
    if ($("#one").val() == 'a') {
        $("#two").val("b")
    } else if ($("#one").val() == 'b') {
        $("#two").val("a")
    }
});

$("#two").change(function () {
    if ($("#two").val() == 'a') {
        $("#one").val("b")
    } else if ($("#two").val() == 'b') {
        $("#one").val("a")
    }
});

两个下拉列表的代码都执行相同的功能.有没有有效的方法来减少代码？就像声明一个共同的功能并将它用于两个下拉菜单(如原型)？

这是JSFiddle.

我收到以下错误:

Uncaught TypeError: ((jQuery.event.special[handleObj.origType] || (intermediate value)).handle || handleObj.handler).apply is not a function

这是我的代码,它介于错误发生beforeSend的success调用和调用之间:

$('#main-container').on('click', '#sign-in-btn', function (event) {
    var username = $('#username-textbox').val();
    var password = $('#password-textbox').val();

    $.ajax({
        url: '/login',
        method: 'POST',

        beforeSend: function (xhr) {
            xhr.setRequestHeader('Authorization', 'Basic ' + btoa(username + ":" + password));
        },

        success: function (data) {
        }
    });

    event.preventDefault();
});

我也尝试进入一个$(document).ready(function () { ... }电话,我得到完全相同的错误.

现在我正在玩KonvaJS.我已经设置了一个click事件监听器shape.单击时shape,将调用侦听器.在我的监听器中,我正在调用event.preventDefault()方法来停止触发其他事件.但是,当我这样做时,它说Uncaught TypeError: event.preventDefault is not a function.我不知道我错过了什么.这是我的代码:

<!DOCTYPE html>
<html>

<head>
  <script src="https://cdn.rawgit.com/konvajs/konva/0.9.5/konva.min.js"></script>
  <meta charset="utf-8">
  <title>Konva Scale Animation Demo</title>
  <style>
    body {
      margin: 0;
      padding: 0;
      overflow: hidden;
      background-color: #F0F0F0;
    }
  </style>
</head>

<body>
  <div id="container"></div>
  <script>
    var width = window.innerWidth;
    var height = window.innerHeight;

    var stage = new Konva.Stage({
      container: 'container',
      width: width,
      height: height
    });

    var layer = new Konva.Layer();

    stage.add(layer);

    var gArrow2 = …