2017-05-30 58 views
0

我有按钮上用onclick:jQuery的触发与通话功能

<button class="tablinks" onclick="openDiv(event, 'default')">{'TEXT_DEFAULT_SETTINGS'|tr}</button> 

openDiv功能:

function openDiv(evt, cityName) { 
    // Declare all variables 
    var i, tabcontent, tablinks; 
    // Get all elements with class="tabcontent" and hide them 
    tabcontent = document.getElementsByClassName("tabcontent"); 
    for (i = 0; i < tabcontent.length; i++) { 
    tabcontent[i].style.display = "none"; 
    } 
    // Get all elements with class="tablinks" and remove the class "active" 
    tablinks = document.getElementsByClassName("tablinks"); 
    for (i = 0; i < tablinks.length; i++) { 
    tablinks[i].className = tablinks[i].className.replace(" active", ""); 
    } 

    // Show the current tab, and add an "active" class to the button that opened the tab 
    document.getElementById(cityName).style.display = "block"; 
    evt.currentTarget.className += " active"; 
} 

我如何可以触发这个的onclick?

+0

'document.querySelector(validSelctor)。点击( )' – Satpal

+0

它会工作,如果你有ID传递给你的元素'cityName' – Omi

回答

2

尝试:

document.getElementsByClassName("tablinks")[0].click() 
1

你的代码工作正常,除非你没有用元素为default ID。 否则你的代码就会突破&给予误差Uncaught TypeError: Cannot read property 'style' of null对于这一说法document.getElementById(cityName).style.display = "block";

见你的代码的下面工作示例:

function openDiv(evt, cityName) { 
 
    // Declare all variables 
 
    var i, tabcontent, tablinks; 
 
    // Get all elements with class="tabcontent" and hide them 
 
    tabcontent = document.getElementsByClassName("tabcontent"); 
 
    for (i = 0; i < tabcontent.length; i++) { 
 
    tabcontent[i].style.display = "none"; 
 
    } 
 
    // Get all elements with class="tablinks" and remove the class "active" 
 
    tablinks = document.getElementsByClassName("tablinks"); 
 
    for (i = 0; i < tablinks.length; i++) { 
 
    tablinks[i].className = tablinks[i].className.replace(" active", ""); 
 
    } 
 

 
    // Show the current tab, and add an "active" class to the button that opened the tab 
 
    document.getElementById(cityName).style.display = "block"; 
 
    evt.currentTarget.className += " active"; 
 
}
#default { 
 
display:none 
 
}
<button class="tablinks" onclick="openDiv(event, 'default')">{'TEXT_DEFAULT_SETTINGS'|tr}</button> 
 

 
<div id="default"> 
 
This is a default div 
 
</div>