使用jQuery从label获取值

时间:2010-06-11 07:32:38

标签: jquery label

我希望从标签中获取月份和年份值。我如何使用jquery获取这些?

<label year="2010" month="6" id="current Month"> June &nbsp;2010</label>

7 个答案:

答案 0 :(得分:18)

首先,我认为id的空格无效。

所以我将id更改为不包含空格。

<label year="2010" month="6" id="currentMonth"> June &nbsp;2010</label>

然后jquery代码很简单(请记住,最好一次获取jquery对象并使用遍历agian)

var label = $('#currentMonth');
var month = label.attr('month');
var year = label.attr('year');
var text = label.text();

答案 1 :(得分:2)

您可以使用attr method。例如,如果您有一个名为label的jQuery对象,则可以使用以下代码:

console.log(label.attr("year")); // logs the year
console.log(label.attr("month")); // logs the month

答案 2 :(得分:1)

我正在将您的ID更改为当前月(没有空格)

alert($('#current-month').attr('month'));
alert($('#current-month').attr('year'));

答案 3 :(得分:1)

使用.attr

$("current_month").attr("month")
$("current_month").attr("year")

将标签ID更改为

<label year="2010" month="6" id="current_month"> June &nbsp;2010</label>

答案 4 :(得分:0)

var label = $('#current_month');
var month = label.val('month');
var year = label.val('year');
var text = label.text();
alert(text);

<label year="2010" month="6" id="current_month"> June &nbsp;2010</label>

答案 5 :(得分:0)

试试这个:

var label = $('#currentMonth').text()

答案 6 :(得分:0)

虽然这个问题相当陈旧,而且已经得到了解答,但我认为我会花时间提供一些选项,这些选项尚未在其他答案中得到解决。

鉴于修正后的HTML(camelCasing id属性值):

<label year="2010" month="6" id="currentMonth"> June &nbsp;2010</label>

您可以使用正则表达式来提取月份名称和年份:

// gets the eleent with an id equal to 'currentMonth',
// retrieves its text-content,
// uses String.prototype.trim() to remove leading and trailing white-space:
var labelText = $('#currentMonth').text().trim(),
    // finds the sequence of one, or more, letters (a-z, inclusive)
    // at the start (^) of the string, and retrieves the first match from
    // the array returned by the match() method:
    month = labelText.match(/^[a-z]+/i)[0],
    // finds the sequence of numbers (\d) of length 2-4 ({2,4}) characters,
    // at the end ($) of the string:
    year = labelText.match(/\d{2,4}$/)[0];

var labelText = $('#currentMonth').text().trim(),
    month = labelText.match(/^[a-z]+/i)[0],
    year = labelText.match(/\d{2,4}$/)[0];

console.log(month, year);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label year="2010" month="6" id="currentMonth"> June &nbsp;2010</label>

不是使用正则表达式,而是使用自定义data-*属性(在HTML 4.x中工作,尽管在doctype下无效,但在HTML 5下有效):

var label = $('#currentMonth'),
    month = label.data('month'),
    year = label.data('year');

console.log(month, year);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label data-year="2010" data-month="6" id="currentMonth"> June &nbsp;2010</label>

请注意,这将输出6(对于data-month),而不是前一个示例中的'June',但如果您使用数组将数字绑定到月份名称,这很容易解决:

var monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
    label = $('#currentMonth'),
    month = monthNames[+label.data('month') - 1],
    year = label.data('year');

console.log(month, year);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label data-year="2010" data-month="6" id="currentMonth"> June &nbsp;2010</label>

同样,上述内容可以轻松转录为原生DOM(在兼容的浏览器中):

var monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
    label = document.getElementById('currentMonth'),
    month = monthNames[+label.dataset.month - 1],
    year = label.dataset.year;

console.log(month, year);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label data-year="2010" data-month="6" id="currentMonth"> June &nbsp;2010</label>

参考文献: