3

好的，所以我已经尝试了几天来弄清楚如何检测用户点击，并将新属性分配给变量。我已经以几种不同的方式尝试了这一点，但其中大多数都不起作用。

到目前为止，我有这个，这是非常自我解释的。

var settings = {
    objSlideTrigger: '#one', // link button id
    objSlidePanel: '#content-one' // slide div class or id       
};


if(document.getElementById('#one').click) {
 var setup = settings;
    setup.objSlideTrigger = '#one',
    setup.objSlidePanel = '#content-one'
};

if(document.getElementById('#two').click) {
 var setup = settings;
    setup.objSlideTrigger = '#two',
    setup.objSlidePanel = '#content-two'
};

当用户单击页面上的 href 时，我希望它能够被 javascript 检测到，并将正确的设置放置在 settings var 中以供其余代码使用。我有两个问题，第一个是，我必须至少重复条件语句十次，所以无论如何要压缩/简化代码。

其次，当在 javascript 中检测到 Href 点击时，我是否必须将 onclick 值分配给 html 中的实际元素？

再次感谢。

4

1 回答 1

3

使用 jQuery

假设您想使用 jQuery，因为您已将其包含在顶部，请使用：

$(document).on('click', '#one', function( event ) {
   //Do Code here
   //For #one click event
});

虽然，为了防止 DRY - 通过使用类使其更通用：

<div class="updatesettings" id="one">One</a>
<div class="updatesettings" id="two">Two</a>

<script>
    $(document).on('click', '.updatesettings', function( event ) {
       //Do Code here
       //For all .updatesettings click event
       alert( $(this).attr('id') );
    });
</script>

使用 JavaScript

var OnOneClick = function() { 
  // Your click handler
};

var OneClick = document.getElementsById("#one");
OneClick.addEventListener('click', OnOneClick, false);

然后听多个，由 Class 使用（虽然不是所有的 IE 版本都可以听这个）：

var AwaitedClickEvent = function() {
    //Class Click
}

var WaitingClick = document.getElementsByClassName('clickme');
for (var i = 0; i < WaitingClick.length; i++) {
   var current = WaitingClick[i];
   current.addEventListener('click', AwaitedClickEvent, false);
}

您的解决方案

<!-- Links with ID & Content -->
<div class="updatesettings" id="one" data-content="content-one">One</a>
<div class="updatesettings" id="two" data-content="content-two">Two</a>

<script>
    /**
     *   Get the clicked element's ID
     *   and it's stored data-content string.
    **/
    $('.updatesettings').on('click', function( event ) {
         var Id = $(this).attr('id'),
             Content = $(this).data('content'),
             setup = settings,
             setup.objSlideTrigger = Id,
             setup.objSlidePenl = Content;

         console.log( setup );
    });
</script>
于 2013-10-14T10:23:45.223 回答