Question

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

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

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检测到它，并将正确的设置放在设置var中以供其余代码使用。我第一次有两个问题，我必须至少复制十次条件语句，所以无论如何都要压缩/简化代码。

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

再次感谢。

Answer 1

使用jQuery

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

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

虽然，为了防止DRY - 使用Classes保持它更通用：

<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);

然后听多个，按类使用（虽然不是所有的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>

检测href点击

1 个答案:

使用jQuery

使用JavaScript

您的解决方案