我想更改div中的所有链接,以便它们不再引用页面,但在单击时运行javascript函数.为此,我写了这个函数:
function buildPageInDiv(htmlString){
console.log(typeof htmlString);
$div = $(htmlString).children("div#myDiv");
$div.children("a").each(function(i, element){toJavascriptLinks(element)});
document.getElementById("targetDiv").innerHTML = $div[0].innerHTML;
}
Run Code Online (Sandbox Code Playgroud)
调用此函数:
function toJavascriptLinks(element){
element.href="#";
element.onclick = function(){console.log('Yeah!')};
console.log(element);
}
Run Code Online (Sandbox Code Playgroud)
现在,当我运行'buildPageInDiv'时,在控制台上打印'string',所有"href"都变为"#",并且对于div中的每一个,控制台都会打印元素:
<a href="#">
Run Code Online (Sandbox Code Playgroud)
这里没有onclick的迹象,点击链接在控制台上没有显示任何内容.
我在这里错过了什么?
编辑:
我在错误的地方寻找.问题是我在将innerHTML附加到'targetDiv'之前运行'toJavascriptLinks(element)'.这对于href属性来说没有问题,但它适用于onclick属性.解决方案只是先将它放在'targetDiv'中,然后在'targetDiv'上运行'toJavascriptLinks(element)':
function buildPageInDiv(htmlString){
console.log(typeof htmlString);
var content = $(htmlString).children("div#myDiv")[0].innerHTML;
document.getElementById("targetDiv").innerHTML = content;
$("div#targetDiv").children("a").each(function(i, element) toJavascriptLinks(element)});
}
Run Code Online (Sandbox Code Playgroud)
虽然问题不在我最初发布的代码中,但下面的综合答案使我得到了解决方案.
基本上我有一个"删除所选项"按钮,只要没有选中复选框就会被禁用.一旦用户选中了复选框,我就想将click事件处理程序绑定到此按钮.
由于用户可能会取消选中复选框并且没有选中,我想将完整的事件处理函数存储在变量中,并且只在选中复选框时将其绑定.
问题是:如何将此事件处理函数存储在变量中以最容易地将其绑定到对象?
直到现在我只使用它来取消绑定事件处理程序(已存在于此对象上),然后再次绑定它,如下所示:
$(my-selector).unbind('click', eventHandler);
$(my-selector).bind('click', eventHandler);
Run Code Online (Sandbox Code Playgroud)
......但从来没有反过来.
我只是想操纵#content div中的元素,但$('#content')似乎不起作用,但在其他地方却有效!我的相关代码非常简单:
<body>
<input type='button' value='Save design' id='save' />
<div id="content" style="height: 200px; width:600px;border: 1px solid black;" class='whatev'></div>
</body>
Run Code Online (Sandbox Code Playgroud)
$(document).ready(function(){
$('#save').click(function(e){
alert( document.getElementById('content').id); // this works!
alert($("#content").length); // this works! it outputs "1"
alert($("#content").id); // this does NOT work - undefined, why?
//end save function
});
$('#content').click(function(e){
// do stuff // ALL of this works!
});
});
Run Code Online (Sandbox Code Playgroud)
这就对了.如果你注意到,它确实在某些地方有效(整个点击功能完全正常),但是如果它不起作用,它奇怪地仍然存在,因为length = 1.我尝试使用上下文来搜索div,以防万一,(使用$('#content','body')),但没有用.
我正在使用http://digitalbush.com/projects/masked-input-plugin/插件.
有一个带定义掩码的输入文本:
<input type="text" id="txtMyInput" class="FocusSense"/>
Run Code Online (Sandbox Code Playgroud)
和一个脚本:
$(document).ready(function () {
jQuery(function ($) {
$("#txtMyInput").mask("?9.99");
});
$(".FocusSense").focus(function () {
this.select();
});
})
Run Code Online (Sandbox Code Playgroud)
正如你所看到的,我想在焦点上选择txtMyInput中的所有内容但是唉!在焦点上,蒙版出现并松散.select().
我该怎么做才能保留mask和.select()?
有没有办法可以调用$(selector).bind('click', handler)或$(selector).on('click', handler)多次调用处理程序只能连接一次?
现在,我有多个具有不同成功回调的AJAX处理程序,每个回调都在页面上重新呈现一组不同的元素.理想情况下,我想将"重新连接事件"例程重构为单个函数而不是所有例程.
我现在想到的唯一方法是明确解除绑定,例如:
$(selector).off('click');
$(selector).on('click', handler);
Run Code Online (Sandbox Code Playgroud)
寻找一种自动执行此类操作的方法.
我有一种情况,在某种情况下,我想要任何jQuery ready处理程序绑定不会实际触发DOMContentReady事件.这些处理程序绑定在各个地方,包括各种包含文件,插件等.因此,虽然我可以在靠近页面顶部的脚本中设置某种全局变量,并且if在每个$(document).ready()绑定之前设置检查此变量的条件,但我宁愿不这样做.
理想情况下,我正在寻找两件事之一,
.ready()ready()处理程序.显而易见的一个,$(document).unbind('ready')不这样做,我猜因为.ready()不是普通的事件绑定.
可以这样做吗?如果是这样,怎么样?
我有一个模糊的想法是扩展jQuery原型,并ready()用一个检查我将要引入的新属性的方法替换.那有意义吗?
我在jsp的遗留项目中有以下代码
<tr>
<th colspan="2">Customer</th>
<td colspan="2">
<a href="myAction.do" target="view">CustomerLink</a></td>
</tr>
Run Code Online (Sandbox Code Playgroud)
当我们点击CustomerLink时,我希望对行为进行少许修改.我只想在点击动作之前在javascript函数中进行一些处理.我没有得到如何模拟javascript函数中的href链接行为?
我试过的: -
<tr>
<th colspan="2">Customer</th>
<td colspan="2">
<a href="javascript:customerLinkClicked('myAction.do')" target="view">CustomerLink</a></td>
</tr>
Run Code Online (Sandbox Code Playgroud)
// javascript函数
function customerLinkClicked(path)
{
// simulate the href link behaviour, not sure how to do this
}
Run Code Online (Sandbox Code Playgroud) 我正在使用此Java Script函数来创建具有Infinite Scroll功能的JSP页面.
<script language="javascript" type="text/javascript">
var count = 0;
window.onload = loadSubPage;
$(window).scroll(function(){
if ($(window).scrollTop() == $(document).height() - $(window).height()){
alert("load appLeadershipSubView function calling");
loadSubPage();
}
});
function loadSubPage()
{
alert("load appLeadershipSubView called");
$.ajax({
cache: false,
url: 'appLeadershipSubView.do?count=' + count,
async : true,
beforeSend: function(){
},
success: function(html){
alert("success event");
$('#mainDiv').append(html);
count++;
},
complete: function(){
}
}
);
}
</script>
Run Code Online (Sandbox Code Playgroud)
正如您所看到的,我正在调用loadSubPage函数将'appLeadershipSubView'页面中的html内容追加到'#mainDiv'中.并且还在页面Load事件中调用loadSubPage.
问题是,当我向下滚动时,它会对loadSubPage函数进行多次(有时是2次)调用,并将重复数据附加到div中.
由于我是JSP和Javascript的新手,我无法在这里找出问题所在.你能指点我这里的问题吗?
document.onkeydown = function(event) {
var tagName = event.target.tagName;
if (tagName != 'INPUT' && tagName != 'TEXTAREA' && !event.alt && event.control) {
if (event.ctrlKey && event.keyCode == 37) {
if (_this.currentPage > 1) {
window.location.href = _this.baseUrl.replace(/%page%/i, _this.currentPage + 1);
}
} else if (event.ctrlKey && event.keyCode == 39) {
if (_this.currentPage < _this.pagesTotal) {
window.location.href = _this.baseUrl.replace(/%page%/i, _this.currentPage - 1);
}
}
}
}
Run Code Online (Sandbox Code Playgroud)
这只在IE 8中出现错误:
'target'为null或不是对象
为那条线 var tagName = event.target.tagName;
如何解决这个问题.按Ctrl或箭头按钮时发生错误.
我有一个textarea默认禁用.然后按'编辑'我从用户那里得到一些输入.如果它有效,我想启用textarea.这是我现在的代码:
<textarea name="comment" cols="5" rows="2" disabled="true"><%= $tmp_com %></textarea>
<a href="javascript:validateUser()">Edit</a>
function validateUser(){
var name=prompt("Please enter the password");
if (name=="1234")
{
document.getElementByName("comment").disabled="false";
}
}
Run Code Online (Sandbox Code Playgroud)