7

次のような行を考えてみましょう。

<div id='abc' onclick='DoSomething(this.id)'></div>

さて、それが次のようなものに拡張されたとします。

<div id='abc' data-something='whatever' onclick='DoSomething(this.id)'></div>

ここにはまだ機能上の違いはありませんが、これが私の質問です。ID の代わりに「data-something」の値を DoSomething 関数に渡す方法を探しています。これを行う方法が見つからないようですか？出来ますか？

次のようなものがいいでしょうが、もちろん、それがどのように機能するかではありません。(意図した目的を説明するためにのみ含めています。

<div id='abc' data-something='whatever' onclick='DoSomething(this.data-something)'></div>
4

4 に答える 4

10

できるよ

DoSomething(this.dataset.something)

ただし、一般的には、javascript 部分と HTML を分離することをお勧めします。これは、要素に id がある場合に特に簡単です。

<div id='abc' data-something='whatever'></div>
<script>
    document.getElementById('abc').onclick = function(){
        DoSomething(this.dataset.something)
    }
</script>

Internet Explorer では、データセットのサポートは不完全です。IE10-では、使用する必要があります

DoSomething(this.getAttribute('data-something'))
于 2013-07-19T15:28:22.177 に答える
5

次のようにできるはずですthis.getAttribute("data-something")。

<div id='abc' data-something='whatever' onclick='DoSomething(this.getAttribute("data-something"))></div>

または使用できますthis.dataset.something。

ここに私の情報源があります

于 2013-07-19T15:28:45.747 に答える
1

メソッドを使用する必要がありますgetAttribute：

<div id='abc' data-something='whatever' onclick='DoSomething(this.getAttribute("data-something")'></div>

ただし、要素へのインライン JavaScript 委任を避けることを強くお勧めします。そのためには DOM または jQuery を使用することをお勧めします。また、 jQueryにはdata-*属性を簡単に処理する方法があることに注意してください。

于 2013-07-19T15:30:11.487 に答える
0

jQuery を検討したい場合は、コードを次のように変換できます。

html

<div id="abc" data-something="whatever">click here</div>

jQuery

jQuery(document).ready(function($) {
    $('#abc').on('click', function () {
        DoSomething($(this).attr('data-something'));
    });
});

またはそれ以上

jQuery(document).ready(function($) {
    $('#abc').on('click', function () {
        DoSomething($(this));
    });
});

function DoSomething(obj){
    alert(obj.attr('id'));
    alert(obj.attr('data-something'));
}
于 2013-07-19T15:55:57.117 に答える