javascript jquery 支持多个项目?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/11624282/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery prop multiple items?
提问by Lostsoul
I'm not sure what I'm doing wrong but for the past 2 hours I've been trying to use prop to change the value of two items in a button. It works for one but not for the other and I have no idea why.
我不确定我做错了什么,但在过去的 2 个小时里,我一直在尝试使用 prop 来更改按钮中两个项目的值。它适用于一个但不适用于另一个,我不知道为什么。
html:
html:
<input type='button' value='Following' id='btnFollow' dataaction="UnFollow" datatype='topic'>
jquery:
查询:
$("#btnFollow").prop("value", "Follow");
$("#btnFollow").prop("dataaction", "Follow");
The first item changes(value
) but not the second one(dataaction
). I have no idea why(other then maybe its too late and my brain is rebelling). According to the documentationI'm doing it correct. I added alerts inbetween each command in case one was failing, but both alerts went off meaning jquery is not crashing or anything when it tries to change the second item. I don't see any spelling mistakes and I tried to daisy chain the commands but still no luck.
第一项改变( value
) 但第二项( )不变dataaction
。我不知道为什么(否则可能为时已晚,我的大脑正在反抗)。根据文档,我做对了。我在每个命令之间添加了警报,以防万一一个命令失败,但两个警报都消失了,这意味着 jquery 在尝试更改第二个项目时没有崩溃或发生任何事情。我没有看到任何拼写错误,我试图菊花链命令,但仍然没有运气。
Any suggestions?
有什么建议?
entire_code:
完整代码:
$(document).ready(function () {
$('#btnFollow').click(function() {
var topic_id = $(this).attr('datatopic');
var action_type = $(this).attr('datatype');
var action_type_action = $(this).attr('dataaction');
alert(action_type_action);
//$("#btnFollow").prop('value', 'Following');
if (action_type_action == 'Follow') {
$("#btnFollow").prop({'value': 'Following', 'dataaction': 'UnFollow'});
//$("#btnFollow").prop("value", "Following");
//$("#btnFollow").prop("dataaction", "UnFollow");
$.ajax({
type: 'POST',
url: '/follow_modification',
async: false,
data: {
topic: topic_id,
action: action_type_action,
follow_type: action_type
}
//complete: function(xmlRequestObject, successString){
// ymmReceiveAjaxResponse(xmlRequestObject, successString);
//}
});
} else if (action_type_action == 'UnFollow') {
$("#btnFollow").prop({'value': 'Follow', 'dataaction': 'Follow'});
//$("#btnFollow").prop("value", "Follow");
//$("#btnFollow").prop("dataaction", "Follow");
$.ajax({
type: 'POST',
url: '/follow_modification',
async: false,
data: {
topic: topic_id,
action: action_type_action,
follow_type: action_type
}
//complete: function(xmlRequestObject, successString){
// ymmReceiveAjaxResponse(xmlRequestObject, successString);
//}
});
}
})
});
回答by zerkms
Your code works just fine: http://jsfiddle.net/zerkms/Capvk/
你的代码工作得很好:http: //jsfiddle.net/zerkms/Capvk/
Properties generally affect the dynamic state of a DOM element without changing the serialized HTML attribute
属性通常会影响 DOM 元素的动态状态而不更改序列化的 HTML 属性
So that's why you don't see it changed in html, but it is changed in DOM instead. If you want it to be changed in HTML as well - use .attr()
所以这就是为什么你没有看到它在 html 中发生了变化,而是在 DOM 中发生了变化。如果您还希望在 HTML 中更改它 - 使用.attr()
PS: as @ahren mentioned in the comments - it probably makes sense to use .data()
and data-xxx
properties
PS:正如@ahren 在评论中提到的那样 - 使用.data()
和data-xxx
属性可能是有意义的
PPS: if you set the value using .prop()
- you need to get it with .prop()
respectively
PPS:如果您使用.prop()
-设置值,则需要.prop()
分别使用
回答by Vins
Please use .attr
jQuery method.
请使用.attr
jQuery 方法。
Please use properly html5 data attribute asenter code here
data-action for which you have new jQuery method to access this data attribute with $('#btnFollow').data('action')
For more details visit
请正确使用 html5 数据属性作为enter code here
数据操作,您有新的 jQuery 方法来访问此数据属性,$('#btnFollow').data('action')
有关更多详细信息,请访问