関数が自己呼び出し関数内にラップされているときに関数が呼び出されない

Question

私は自分のプロジェクトにjavascriptを使用していますが、いくつかのjavascript関数を定義しましたが、DOMMonsterを通じて関数を検証したとき、あまりにも多くのグローバル関数宣言があること。

これを克服するために、私は関数のグローバルな性質を取り除くことができた自己呼び出し関数の中に関数を閉じ込めました。 OnChangeイベントで呼び出された2つの関数は起動していません。誰かが私の中にそれを同じように働かせる方法を提案することができます。

CODE

(function(){ 
    function createHiddenDateField(elementName) { 
     // format is DD/MM/YYYY 
     var finalDate = document.getElementById(elementName + '-DD').value + '/' + document.getElementById(elementName + '-MM').value + '/' + document.getElementById(elementName + '-YYYY').value; 
     document.getElementById(elementName).value = finalDate; 
     if(elementName=="securityQuestionAnswerDate"){ 
      document.getElementById("securityQuestionAnswerDate").onchange(); 
     } 
     return finalDate; 
    } 
})(); 

CALLER：

<select id="dateofbirth-DD" class="form_field date_field_select 
        " onchange="createHiddenDateField('dateofbirth')"> 
        <option value="">DD</option> 
        <option value="01">01 
        </option> 
        <option value="02">02 
        </option> 
        <option value="03">03 
        </option> 
        <option value="04">04 
        </option> 
        <option value="05">05 
        </option> 
        <option value="06">06 
        </option> 
        <option value="07">07 
        </option> 
        <option value="08">08 
        </option> 
        <option value="09">09 
        </option> 
        <option value="10">10 
        </option> 
        <option value="11">11 
        </option> 
        <option value="12">12 
        </option> 
        <option value="13">13 
        </option> 
        <option value="14">14 
        </option> 
        <option value="15">15 
        </option> 
        <option value="16">16 
        </option> 
        <option value="17">17 
        </option> 
        <option value="18">18 
        </option> 
        <option value="19">19 
        </option> 
        <option value="20">20 
        </option> 
        <option value="21">21 
        </option> 
        <option value="22">22 
        </option> 
        <option value="23">23 
        </option> 
        <option value="24">24 
        </option> 
        <option value="25">25 
        </option> 
        <option value="26">26 
        </option> 
        <option value="27">27 
        </option> 
        <option value="28">28 
        </option> 
        <option value="29">29 
        </option> 
        <option value="30">30 
        </option> 
        <option value="31">31 
        </option> 
       </select> 

Answer 1

トライ利用のget（）この操作を行うと、多分あなたは良い時間を節約することができますjqueryのようなものを使用するか、 angularjsします！ http://www.w3schools.com/jsref/jsref_getdate.asp

Answer 2

しかし、2 OnChangeイベントで呼び出された関数はグローバルでなければなりませんonxyz属性でフックアップ

機能を発射されていません。グローバルがBad Thing™なので、onxyz -attribute-styleイベントハンドラを使用しない理由の1つです。代わりに

、近代的なイベント処理を使用してハンドラをフックアップ、例えば：

document.getElementById("dateofbirth-DD").addEventListener(
    "click", 
    function() { 
     createHiddenDateField('dateofbirth'); 
    }, 
    false 
); 

あなたがaddEventListenerをサポートしていない古いブラウザをサポートする必要がある場合は、あなたのためにそれらを処理する関数のためthis answerを参照してください。