我正在编写一个用户脚本,将自定义javascript注入页面的头部。容易腻话
// ==UserScript==
// @name *** (BLOCKED DUE TO NDA)
// @namespace *** (BLOCKED DUE TO NDA)
// @description *** (BLOCKED DUE TO NDA)
// @include *** (BLOCKED DUE TO NDA)
// @author Aaron K. Henderson
// @version 1.0
// ==/UserScript==
var head= document.getElementsByTagName('head')[0];
var script= document.createElement('script');
script.type= 'text/javascript';
script.src= '***.js';
head.appendChild(script);
我注入的.js利用已经在页面上使用的jQuery来进行一些css更改以及自动执行一些平凡的任务。
我想要发生的是当我触发$('#approve-all-button').click()
并且它检测到应用红色背景的用户名时,脚本也会点击删除“按钮”。
按钮原始网站上的代码如下所示:
<div class="jquery-buttongroup ui-buttonset">
<input type="radio" id="form-0-status_A" name="form-0-status" value="A" class="ui-helper-hidden-accessible">
<label for="form-0-status_A" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-left" role="button" aria-disabled="false">
<span class="ui-button-text">Approved</span>
</label>
<input type="radio" id="form-0-status_I" name="form-0-status" value="I" checked="checked" class="ui-helper-hidden-accessible">
<label for="form-0-status_I" class="ui-state-active ui-button ui-widget ui-state-default ui-button-text-only" aria-pressed="true" role="button" aria-disabled="false">
<span class="ui-button-text">Inactive</span>
</label>
<input type="radio" id="form-0-status_D" name="form-0-status" value="D" class="ui-helper-hidden-accessible">
<label for="form-0-status_D" aria-pressed="false" class="ui-button ui-widget ui-state-default ui-button-text-only ui-corner-right" role="button" aria-disabled="false">
<span class="ui-button-text">Deleted</span>
</label>
</div>
上述按钮代码有100次迭代。每个迭代ID集都有一个变量,每次迭代都会增加1,例如
id =“form-0-status_D”
id =“form-1-status_D”
id =“form-2-status_D”
id =“form-3-status_D”
id =“form-4-status_D”
$('#form-'+i+'-status_D')
$(document).ready(function() {
// Rename Approve All Button
$('#approve-all-button span').text('Scan + Detect');
// The Magic
$('#approve-all-button').click(function(i) {
i.preventDefault();
var Current_Name = '';
// Loop through TR
$('tr').each(function(i) {
if (i > 0) {
var _self = $(this)
// Get Current Username in Loop
Current_Name = _self.children('.username').text();
// Apply Default Color to All (Green)
_self.css('background-color', '#0AFE47');
// Apply Approved Class to All
_self.addClass('AddApproved');
// Hide Creation Date / Last Login
_self.children('.nowrap').css('opacity','.1').css('background-color','white');
// Get Current Username Length
var nlen = Current_Name.length;
// If Name Length is <= 3 or >= 15 Apply Color (Red)
if ((nlen <= 3) || (nlen >= 15)){
_self.css('background-color','#FF7575').
addClass('AddDeleted').
removeClass('AddApproved').
removeClass('AddInactive');
$(_self).children('#form-'+i+'-status_D').trigger('click');
}
var nDigits = 0;
for ( var t=0; t<nlen; t++) {
var chr = Current_Name.charAt(t);
if (chr >= "0" && chr <= "9") nDigits++;
}
var charcount = nlen - nDigits;
if ((nDigits >=6) || (charcount < 3) || (nDigits == nlen)) {
_self.css('background-color','#FF7575').
addClass('AddDeleted').
removeClass('AddApproved').
removeClass('AddInactive');
$(_self).children('#form-'+i+'-status_D').trigger('click');
}
}
});
});
// On Button Click, Change Background and Add/Remove class
$('label').click(function(i) {
var _self = $(this)
var button = _self.attr('for');
var status = button.substring(button.lastIndexOf('-') + 1);
if (status == 'status_D') {
_self.closest('tr').css('background-color','#FF7575').
addClass('AddDeleted').
removeClass('AddApproved').
removeClass('AddInactive');
} else if (status == 'status_A') {
_self.closest('tr').css('background-color','#0AFE47').
addClass('AddApproved').
removeClass('AddInactive').
removeClass('AddDeleted');
} else if (status == 'status_I') {
_self.closest('tr').css('background-color','#0AFE47').
addClass('AddInactive').
removeClass('AddApproved').
removeClass('AddDeleted');
}
});
});
同样,我想要发生的是当我点击Approve All div来循环所有并且应用默认事件(将其设置为批准),除非特定规则(用户名&lt; = 3 ||&gt; = 15 ||等)被触发。在这种情况下,我想要选择删除按钮。 我试图点击删除按钮:
$('#form-'+i+'-status_D').trigger('click');
然而,这似乎不起作用。
我似乎遇到的问题是我添加点击事件已经有另一个与之关联的点击事件,似乎取代了我的事件。我试图解开现有的事件;哪个成功解开绑定,但如果没有绑定我无法.trigger
在这种情况下,trigger('click')
失败了吗?或者我的代码中有一些打嗝。
在通过页面上的来源筛选时,我确实找到了这个链接的javascript页面
var Actions = {
init: function() {
var selectAll = document.getElementById('action-toggle');
if (selectAll) {
selectAll.style.display = 'inline';
addEvent(selectAll, 'click', function() {
Actions.checker(selectAll.checked);
});
}
var changelistTable = document.getElementsBySelector('#changelist table')[0];
if (changelistTable) {
addEvent(changelistTable, 'click', function(e) {
if (!e) { var e = window.event; }
var target = e.target ? e.target : e.srcElement;
if (target.nodeType == 3) { target = target.parentNode; }
if (target.className == 'action-select') {
var tr = target.parentNode.parentNode;
Actions.toggleRow(tr, target.checked);
}
});
}
},
toggleRow: function(tr, checked) {
if (checked && tr.className.indexOf('selected') == -1) {
tr.className += ' selected';
} else if (!checked) {
tr.className = tr.className.replace(' selected', '');
}
},
checker: function(checked) {
var actionCheckboxes = document.getElementsBySelector('tr input.action-select');
for(var i = 0; i < actionCheckboxes.length; i++) {
actionCheckboxes[i].checked = checked;
Actions.toggleRow(actionCheckboxes[i].parentNode.parentNode, checked);
}
}
};
addEvent(window, 'load', Actions.init);
点击标签/输入广播后,Google Chrome(通过检查此元素)会告诉我该脚本已被调用。 (我不知道这些信息是否对任何信息有帮助,但是由于我对jQuery的了解有限,阅读它已经超出了我的范围)
另外,为了清除任何混淆,我只是添加AddApproved/AddInactive/AddDeleted
类来进行计数。
我还没有为此实施计数器,但我已经知道我将如何做到这一点。
P.S。这是我第一次使用jQuery,所以这对于我的工作场所来说也是一种工具,因为它是一种学习体验。如果有些代码看起来很糟糕,我会道歉。
答案 0 :(得分:1)
trigger()
可以正常工作。引自jQuery文档站点:
任何附加.bind()或其快捷方式的事件处理程序 当相应的事件发生时触发方法。他们可以 但是,使用.trigger()方法手动触发
在您的情况下,订阅#form-1-status_D
上的点击事件并在那里写下必要的代码,现在您可以拨打电话trigger('click')
。
请注意,在您更改div
ID时,只需订阅一次div
即可。
答案 1 :(得分:1)
你有这个:
var _self = $(this);
$(_self).children('#form-'+i+'-status_D').trigger('click');
第二行应该是:
_self.children('#form-'+i+'-status_D').trigger('click');
您的变量_self
已经$(this)
引用了jQuery,因此不应该像$(_self)
那样使用$($(...))