web-dev-qa-db-ja.com

jQueryを使用してラベルから値を取得する

ラベルから月と年の値を取得したい。 jqueryを使用してこれらを取得するにはどうすればよいですか?

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

まず、IDのスペースは有効ではないと思います。

そこで、スペースを含まないようにIDを変更します。

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

その後、jqueryコードは単純です(覚えておいてください、jqueryオブジェクトを一度フェッチして、繰り返しアジャンで使用することをお勧めします)

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

attr method を使用できます。たとえば、labelというjQueryオブジェクトがある場合、次のコードを使用できます。

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

IDをcurrent-month(スペースがない)に変更します

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

.attrを使用

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

ラベルIDを次のように変更します

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

これを試して:

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

この質問はかなり古く、回答済みですが、他の回答ではまだ対処されていないいくつかのオプションを提供するために時間をかけると思いました。

以下の修正済みHTML(camelCasing id attribute-value)が与えられた場合:

_<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-*_属性を使用できます(これは、Doctypeでは無効ですが、HTML 5では有効ですが、HTML 4.xでは機能します)。

_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>_

参照:

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>
0
hari