标签: javascript-events

基本上我在a上使用jQuery ui的可选功能ul,但是ul经常会有一个滚动条,而且这个滚动条在Webkit浏览器中变得无法使用,因为当你试图点击它来抓取它时,可选功能的套索会被拉到顶层代替.

我已经制定了一个解决方案,其中包括检查光标相对于ul的位置和宽度的位置,以查看光标是否在滚动条上方,如果是,则停止传播可选择的"start"事件,但尽管如此应该满足有条件的时候,既不返回false也不停止事件的进程似乎阻止了jquery在可选事件中前进.

以下是我对jquery .selectable start事件的看法:

start: function(event, ui) {
    var t = event.target;
    var cutoff  = t.scrollWidth + t.offsetLeft
    if (event.clientX > cutoff)
    {
        console.log('NO!');
        console.log(event.type);

        //overkill
        event.stopPropagation();
        event.stopImmediatePropagation();

        if (event.stopPropagation) {
          event.stopPropagation();
        } else {
          event.cancelBubble = true;
        }

        return false;
    }
}

所有建议/解决方案表示赞赏,谢谢

在任何编程语言中,我都可以跟踪任何函数并知道其他函数调用了哪个函数.但是在Javascript中,我不知道如何,因为代码不是由我编写的,而且Firebug没有提供此功能 - 据我所知.

一个例子 :

我想显示单击XYZ元素时调用的每个函数的函数名称,并按顺序显示它们.

谢谢.

我目前正在使用此Javascript kepypress代码在按键时触发事件:

$(document).keydown(function(e) {
    switch(e.keyCode) {

    case 39:
        e.preventDefault();
        alert("Arrow Key");
        break;

    case 37:
        e.preventDefault();
        alert("Arrow Key");
    }
});

但我想知道的是,如果我可以而不是绑定一个键绑定两个键的组合.我可以这样做:

$(document).keydown(function(e) {
    switch(e.keyCode) { 
        case 39 && 37:
            e.preventDefault();
            alert("Arrow Key");
        break;
    }
});

如果在该区域外单击,我想阻止contentEditable区域失去焦点.一些示例HTML如下所示:

<div id="content">
    <p>Hello</p>
</div>
<div id="clickThis">
    <p>If you click on this or anywhere for that matter after focusing on Hello, you lose your focus on Hello</p>
</div>

示例javascript如下所示:

$(document).ready(function()
{
    $('#content')[0].contentEditable=true;

    $('#clickThis').bind('click',function(e)
    {
        console.log(window.getSelection().getRangeAt(0).startContainer);
        e.preventDefault();
    });
});

当你点击#clickThisdiv或div之外的任何地方时#content,#content即使你调用click事件的preventDefault函数,你也会失去对div的关注.

此外,范围会在click事件触发的那一刻发生变化,所以我不能在点击发生后返回上一个范围.有没有办法在点击发生后保持光标位置和焦点？

谢谢.

jsFiddle:http://jsfiddle.net/VivekVish/FKDhe/4/

我正在使用以下代码

<div class="business-bottom-content" onMouseOver="javascript:this.className='business-bottom-    content-hover';"  onMouseOut="javascript:this.className='business-bottom-content';"> 

jquery脚本如下

 $("div.business-bottom-content").click(
 function()
  {
   alert('ashutosh mishra');
  });

这不仅适用于谷歌浏览器扩展程序,也适用于javascript

我正在编写一个chrome扩展,其中当文本突出显示并显示上下文菜单时,我在上下文菜单中显示我的项目,单击该菜单时应处理所选文本

在调出上下文菜单并选择我的选项后,我得到所有值为零和空值的空对象

所以我想实现一些机制,一旦用户在选择文本后释放鼠标就会缓冲文本选择,以便事件可以触发,如果有任何事情发生,我可以在全局变量中复制所选文本可以稍后处理

当我使用单独的测试代码进行测试时,window.getSelected()工作正常,但在使用我的扩展程序时,我调出了上下文菜单,我无法获得实际选中的文本

我在文档中看到的所选文本将是文本和HTML

建议请...

在这里,我粘贴了我正在做的事情.当我点击保存到单词提醒时,我得到一个空字符串

这是代码的其余部分

<script>
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {


    switch(request.message)
    {
        case 'getSelection':
            sendResponse({data: window.getSelection().toString()});
        break;

        case 'createMenu':
            seecon();
            break;

        default:
            sendResponse({data: 'Invalid arguments'});
        break;
    }
});

function conOnClick(info,tab)
{

/*
    chrome.extension.sendRequest(tab.id, {method: 'getSelection'}, function(response){
        alert(response.data);
    });
*/  
}


//function seecon()
{
var contexts = ["selection"];
for (var i = 0; i < contexts.length; i++) {
  var context = contexts[i];
  var title = "Save to Word Reminder";
  var id = chrome.contextMenus.create({"title": title, "contexts":[context],
                                       "onclick": conOnClick}); …

我不知道为什么这不起作用,但我确定这是一个非常常见的javascript.我的语法显然缺乏,我不知道为什么:

<input type="text" value="search" id="search" name="q" onclick="javascript:if($(this).val() == 'search') {$(this).val() = '';} return false;" />

谢谢!

第一个版本没有向我显示x和y并得到以下错误:Uncaught TypeError: Cannot read property 'pageX' of undefined第二个版本工作但编码非常相似,找不到问题.

第一版(不工作)

    <form name ="show">
        <input type="text" name="mouseXField" value="0" size="6">Mouse X Position<br>
        <input type="text" name="mouseYField" value="0" size="6">Mouse Y Position<br>
    </form>

        <script type="text/javascript">

        var mie = (navigator.appName == "Microsoft Internet Explorer") ? true : false;

        if (!mie) {

            document.captureEvents(Event.MOUSEMOVE);
            document.captureEvents(Event.MOUSEDOWN);
        }


        document.onmousemove = mousePos();
        document.onmousedown = mouseClicked();

        var mouseClick;
        var keyClicked;

        var mouseX = 0;
        var mouseY = 0;

        function mousePos (e) {

            if (!mie) {
                mouseX = e.pageX; 
                mouseY = e.pageY; …

假设我有一个带有两列布局的页面,其中左列是一组链接,并且当单击该链接时,它会在右列中加载关联的html页面/模板.

在加载模板时,有一个模板处理程序,它通过requirejs初始化为单例,并定义了一些方法和处理程序,如:

SomePage.prototype.saveHandler: function(e) { ... }; // Page handler has a handler

SomePage.prototype.initialize: function() {
    $('#btnSave').on('click', saveHandler);
}

然后,每次页面加载时,我都会通过初始化方法附加DOM事件.

SomePage.initialize(); // This attaches the click event

现在,当我单击左侧的另一个链接时,将加载另一个模板页面,并为该页面重复上述过程.

我想知道之前附加到btnSave元素的click事件会发生什么？它现在是jQuery缓存中的悬空事件处理程序吗？

如果我再次加载同一页面时尝试删除它,它会实际删除原始事件吗？

$('#btnSave').off('click', saveHandler);

执行以下块是否可以防止内存泄漏/悬空引用？

// The potential problem here is that btnSave is part of the newly loaded template 
// and not the element i attached the handler to earlier (which doesn't exist anymore)
$('#btnSave').off('click', saveHandler);

$('#btnSave').on('click', saveHandler); 

什么是确保我最终没有悬挂引用和内存泄漏的最佳方法.这也是普通javascript的一个潜在问题.我的理解是,刷新模板页面时上述操作无效.我在同时试验它,但是知道专家如何处理它会很好.谢谢!

即使用户选择相同的值,如何每次都触发jQuery更改事件？我需要一个刷新效果,例如,如果用户选择律师并且它hello再次提醒用户从下拉列表中选择律师,它应该提醒hello.我怎样才能实现它？以下是代码.

jQuery的

function filterPullDown () {
    alert('hello');
}
$(".businessTypePullDown").change(filterPullDown);

HTML

<select class="businessTypePullDown">
    <option value="" disabled selected>Business Type</option>
    <option value="1">General</option>
    <option value="2">Lawyer</option>
    <option value="3">Software Development</option>
    <option value="4">Auto-repair</option>
</select>

链接到小提琴