小编Ram*_*o M的帖子
在jQuery中通过索引获取元素
我有一个无序列表和该列表中的li标记索引.我必须li通过使用该索引并更改其背景颜色来获取元素.这可能不循环整个列表吗？我的意思是,有没有什么方法可以实现这个功能？
这是我的代码,我相信它会起作用......
<script type="text/javascript">
var index = 3;
</script>
<ul>
<li>India</li>
<li>Indonesia</li>
<li>China</li>
<li>United States</li>
<li>United Kingdom</li>
</ul>
<script type="text/javascript">
// I want to change bgColor of selected li element
$('ul li')[index].css({'background-color':'#343434'});
// Or, I have seen a function in jQuery doc, which gives nothing to me
$('ul li').get(index).css({'background-color':'#343434'});
</script>
推荐指数
解决办法
查看次数
点击位置打开弹出窗口
嗨,
我做了一个弹出窗口,默认情况下隐藏并在窗口触发点击时打开.必须在触发事件的任何地方显示弹出窗口.但是有一些限制:
必须在当前可见窗口显示弹出窗口.意思是,如果我在窗口的最右侧部分单击,则弹出窗口必须显示在单击位置的右侧以避免滚动.
如果窗口滚动,则无论滚动如何,它都应显示在窗口的可见部分.
除了在这种情况下,如果窗口滚动,一切都在我现在的代码中正常工作.如果向下滚动并单击窗口中间,则会在窗口当前显示区域外显示弹出窗口.........................
<!DOCTYPE HTML PUBLIC>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
<style>
div{
border:1px solid;
background:#ff9999;
width:500px;
height:500px;
display:none;
position:absolute;
}
</style>
<script>
var mouseX,mouseY,windowWidth,windowHeight;
var popupLeft,popupTop;
$(document).ready(function(){
$(document).mousemove(function(e){
mouseX = e.pageX;
mouseY = e.pageY;
//To Get the relative position
if( this.offsetLeft !=undefined)
mouseX = e.pageX - this.offsetLeft;
if( this.offsetTop != undefined)
mouseY = e.pageY; - this.offsetTop;
if(mouseX < 0)
mouseX =0;
if(mouseY < 0)
mouseY = 0;
windowWidth = $(window).width();
windowHeight = $(window).height();
}); …推荐指数
解决办法
查看次数
使用 JavaScript / jQuery 获取按键上的 X,Y 坐标
我正在开发一个富文本编辑器。我想当用户ctrl+space在触发事件的位置按下按键时打开用户定义的上下文菜单。
我没有得到事件的坐标。有没有可能获得事件坐标？
这是我的示例代码
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
<style>
#edit{
border:1px solid red;
width:500px;
height:300px;
}
#ctxMenu{
display: none;
position: absolute;
border: 1px solid #000000;
}
#ctxMenu ul li{
list-style: none;
}
</style>
</head>
<body>
<div id="edit" contenteditable="true">
</div>
<div id="ctxMenu">
<ul>
<li>One</li>
<li>Two</li>
<li>Three</li>
<li>Four</li>
</ul>
</div>
<script>
$('#edit').keydown(function(e){
/**** get x, y coordinates.
*
*/
if (e.ctrlKey && e.keyCode == 32) {
$('#ctxMenu').show().css({left:x,top:y});
}
});
</script>
</body>
</html>
推荐指数
解决办法
查看次数
如果表头具有多行并且colspan到表单元格,则表列调整大小不起作用
我正在使用一个小部件(我在网上得到它)来调整表列的大小.如果表头<thead>具有相同列数的行但如果该colspan属性设置为行的单元格则不起作用,则其工作正常.假设表中有两行有六列.第一个单元格将具有colspan=6,第二个单元格将具有所有列.在这种情况下,调整大小应适用于第二行.但它不起作用.
有人能让我知道原因吗？
这是我的代码:
<!DOCTYPE>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
<style>
table{
table-layout: fixed;
border-collapse: collapse;
border: 1px solid black;
}
tr.last td {
border-bottom: 1px solid black;
}
td{
border-right: 1px solid black;
border-bottom: 1px solid black;
position: relative;
white-space:nowrap;
padding: 2px 5px;
text-align: left;
overflow:hidden;
}
td.last {
border-right: none;
}
thead td div:first-child{
text-overflow:ellipsis;
overflow:hidden;
}
tbody td div:first-child{
overflow:hidden;
}
.scrollContainer {
overflow:auto;
width:700px;
height:auto;
display:inline-block;
border:1px solid red;
} …推荐指数
解决办法
查看次数
JSON stringify 正在添加反斜杠
当字符串化的字符串被直接发送到请求时，它不会被添加任何斜杠。
var data = { "A": "Aa", "B": "Bb", "C": "Cc" }; // This is JSON object
data = JSON.stringify(data); // Getting stringified
var obj = {method: "POST",
url: 'http://..XX..XXX.....com',
data: data // String is being sent as it is
};
$http(obj);// Have no slashes added
//Output: {"A":"Aa","B":"Bb","C":"Cc"}
但是，如果将字符串化的字符串设置为对象的属性并将对象发送到服务器，则该字符串带有反斜杠。
var data = { "A": "Aa", "B": "Bb", "C": "Cc" };
data = JSON.stringify(data);
var obj = {method: "POST",
url: 'XXX',
data: { // String is being sent as a value …推荐指数
解决办法
查看次数
jQuery在Firefox中不起作用
jQuery在Firefox中不起作用.它在IE和谷歌浏览器中运行良好,但当我试图在Mozilla Firefox中运行我的应用程序时,jQuery无效.任何猜测？ 这是我的一段代码
<!DOCTYPE HTML PUBLIC>
<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
<style>
div{
width:200px;
height:100px;
border:1px solid red;
}
</style>
</head>
<body>
<div> One</div>
<div>Two</div>
<div>Three</div>
</body>
<script>
$('div').click(function(){
alert("Hello.....");
});
</script>
</html>
推荐指数
解决办法
查看次数
在链接函数中将事件绑定到指令的子元素
需要将事件绑定到指令的子节点,该子节点在templateUrl中使用ng-repeat准备.我试图在事件中绑定事件,link但孩子们还没准备好.
这是掠夺者.
在这里,我想绑定使用ng-repeat准备的标签上的click事件.li但是,当link执行时,li元素尚未准备好.
有人可以帮忙吗
推荐指数
解决办法
查看次数
避免将 css 样式应用于子元素
有没有办法让父标签样式不适用于子标签元素？
我必须显示一些数据，所以我希望将它们在表格中对齐以便更好地查看。我想对表格应用一些样式以使其看起来不错。我在我的表中使用了一些额外的组件（如插件）。因此，如果我确实将任何样式应用于我的表的 tr 标签，那么这些样式也会应用于这些组件标签，如果它们具有 tr 标签。这不应该发生...
有什么办法可以避免继承吗？
<style>
/*The plug-in component may have table tr tags.So the following styles should be applied to plug-in..*/
table tr{
background:#434334;
border-radius:5px;
}
</style>
推荐指数
解决办法
查看次数
CSS后台属性不能覆盖IE过滤属性？
嗨..
我有一个标签,其背景默认为渐变(IE).
label{
width:100px;
height:100px;
border:1px solid red;
filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorStr="#ff3333",endColorStr="#663300");
}
<label> Rama Rao </label>
我允许用户以渐变或正常方式更改背景颜色.我正在获取用户输入的值,并设置css:
<label style="background:#val1"> Rama Rao </label>
要么
<label style="filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorStr="#val1",endColorStr="#val2");"> Rama Rao </label>
它可以工作,如果用户再次设置渐变...但不是如果用户输入正常颜色...但据我所知,一个inline-style可以覆盖内部风格.....但它不工作的filter情况下(我的意思是,过滤器不能是被背景覆盖) ...我怎样才能克服这一点？
注意:对于名称震动,我在<label>这里提到......但是任何标签都可能发生....
推荐指数
解决办法
查看次数
何时检查复选框元素的属性是否添加到DOM？
我需要将所有选中的复选框着色为绿色并取消选中一个为红色.
<style>
input[type=checkbox]+span{
color:red;
}
input[type=checkbox][checked]+span{
color:green;
}
</style>
<label>
<input type="checkbox" class="bike"/>
<span>I have a bike</span></label>
<label>
<input type="checkbox" checked class="car"/>
<span>I have a car</span>
</label>
加载页面时看起来很好.但是后来,当用户点击任何复选框时,它的颜色没有被更改.调试后,我发现checked当用户点击发生时,该属性没有添加到输入标签.有人可以告诉我原因吗？
我试图checked明确地放置属性然后它运作良好.
<button>Click</button>
<script>
$('button').click(function(){
$('.bike').attr('checked',true);
});
</script>
但我不想使用任何脚本来实现这一目标.有没有办法让它成为可能？
实际上将checked属性添加到复选框以进行检查？这是jsfiddle.
推荐指数
解决办法
查看次数