クリックイベントを発生させる方法は？

Question

フォームにはボタンがあり、クリックするとさまざまなタイプのドロップダウンが表示されます。フォームの準備ができたら、どのようにこれらのタイプのクリックイベントを発生させることができますか？

これは私が試したものですが、動作しません。

<script> 
    $(document).ready(function() { 
     document.getElementsByClassName("advanced-search-add-text-row").click(); 
    }); 
</script> 

    <div class="btn-group"> 
    <a class="btn btn-success dropdown-toggle advanced-search-add-row-dropdown" data-toggle="dropdown" href="#"> 
     <span class="glyphicon glyphicon-plus glyphicon-white"></span> 
     <span class="caret"></span> 
    </a> 
    <ul class="dropdown-menu pull-right"> 
     <li><%= link_to I18n.t("advanced_search.type.text"), "javascript:void(0)", :class => "advanced-search-add-row advanced-search-add-text-row", "data-type" => "text" %></li> 
     <li><%= link_to I18n.t("advanced_search.type.date"), "javascript:void(0)", :class => "advanced-search-add-row advanced-search-add-date-row", "data-type" => "date" %></li> 
     <li><%= link_to I18n.t("advanced_search.type.boolean"), "javascript:void(0)", :class => "advanced-search-add-row advanced-search-add-bool-row", "data-type" => "boolean" %></li> 
     <li><%= link_to I18n.t("advanced_search.type.controlled_value"), "javascript:void(0)", :class => "advanced-search-add-row advanced-search-add-enum-row", "data-type" => "enum" %></li> 
    </ul> 
    </div> 

行を作成するためのJavaScript：

$advancedSearchContainer.on("click", ".advanced-search-add-row", function(event) { 
    event.stopPropagation(); 
    event.preventDefault(); 

    var index = $("input[id^='v']", $advancedSearchRowContainer).length; 

    var adding_as_first_row = false; 
    if (index == 0) { 
     adding_as_first_row = true; 
    } 

    while ($(":input[name='f"+index+"']", $advancedSearchContainer).length > 0) { 
     index += 1; 
    } 

    addAdvancedSearchRow(index, $(this).data("type"), adding_as_first_row, {}); 

    // hide the drop down menu after clicking an option 
    $(this).closest(".dropdown-menu").siblings(".advanced-search-add-row-dropdown").trigger("click"); 
    }); 

Answer 1

getElementsByClassName戻りHTMLCollection。

だから、行変更：あなたが書くことができるのjQueryを使用して、代わりに

document.getElementsByClassName("advanced-search-add-text-row")[0].click(); 

：に

document.getElementsByClassName("advanced-search-add-text-row").click(); 

を

$(".advanced-search-add-text-row").trigger('click'); 

Answer 2

のgetElementsByClassNameは、配列を返します！そして、あなたは全体のアレイ上のクリック機能を実行することはできません、あなたは各要素をクリックする必要があります。

elems=document.getElementsByClassName("class"); 
for(i=0;i<elems.length;i++){ 
elems[i].click(); 
}