將內聯代碼移入功能，並生成對象名稱

我正在自定義Denis Gritcyuk的Popup date picker。將內聯代碼移入功能，並生成對象名稱

此彈出式腳本使用內聯JavaScript在href鏈接，選定的日期設置爲input場，在父窗口，即是呼籲。一個例子URL看起來像：
```
<a href="javascript:window.opener.document.formname.field.value='03-10-2011'; 
     window.close();">3</a> 
```
輸入字段名稱，（例如document.formname.field），被傳遞到腳本作爲字符串參數。

我想單擊鏈接時添加的內容（例如更改字段的背景顏色，設置標誌等）。所以，雖然這樣做，但它很快就會變得很難看。

<a href="javascript:window.opener.document.formname.field.value='03-10-2011'; 
     window.opener.document.formname.field.style.backgroundColor='#FFB6C1'; 
     window.close();">3</a>

我將如何將這些內嵌命令插入JS功能？這會給我更清潔的網址和代碼。該URL現在看起來像

<a href="javascript:updateField ('document.formname.field', '03-10-2011');">3</a>

與喜歡（這個例子顯然是行不通的）功能：

function updateField (str_target, str_datetime) { 
    var fieldName = "window.opener" + str_target; 
    [fieldName].value = str_datetime; 
    [fieldName].style.backgroundColor = '#FFB6C1'; 
    // Set flag, etc. 
    window.close(); 
}

那麼如何可以做到這一點有什麼建議嗎？

來源

2011-10-24 Shmuel A. Kam

我寧願隱藏從當前窗口回溯到開啓者的dom路徑。將函數烘焙到函數中是合適的，因爲該函數將始終用於該子彈出的上下文中。然後你的函數調用更清晰，更具可讀性。顯然，將「myField」替換爲您打算更新的字段的ID。

<a href="javascript:window.opener.updateField('03-10-2011', 'myField');">3</a> 

function updateField (str_date, str_fieldname) { 

    var fieldToUpdate = document.getElementById(str_fieldname); 

    fieldToUpdate.value = str_date; 
    fieldToUpdate.style.backgroundColor = '#FFB6C1'; 

    // Set flag, etc. 
    window.close(); 

}

來源

2011-10-24 19:08:22

我發現你的解決方案非常可讀和優雅。唯一的問題是我無法實現它的工作。當我按下鏈接時，沒有任何事情發生。我很確定這個函數沒有被調用，因爲我在那裏放了一個警報。 3 –

@ ShmuelA.Kam：使用console.log而不是alert。它更加用戶友好。 – hugomg

現在工作，只需稍作更改。最欣賞它。 –

您正在訪問該屬性不正確。嘗試：

function updateField (str_target, str_datetime) { 
    var fieldName = window.opener; 
    str_target = str_target.split('.'); 
    for (var i = 0; i < str_target.length; i++) 
     fieldName = fieldName[str_target[i]]; 
    fieldName.value = str_datetime; 
    fieldName.style.backgroundColor = '#FFB6C1'; 
    // Set flag, etc. 
    window.close(); 
}

的括號記號（[]）僅用於對象的屬性，而不是對象本身。如果您發現我的帖子有幫助，請投票支持。

來源

2011-10-24 19:00:44

我需要喬納斯的回答來理解那個循環在做什麼。這種方法看起來有點尷尬，不是嗎？ –

是的。我沒有詳細說明我的答案。喬納斯提供瞭解釋並提供了代碼。使它完成正確嗎？哦，它有什麼方法讓你看起來很尷尬？ –

我認爲分割字符串並重復遍歷它是尷尬的，效率低下的。但是，是的，Paul的方法確實「破壞」了API。幸運的是這是一個非常小的變化。我對結果很滿意。 –

您可以使用eval函數來構建字符串並將其評估爲代碼，但我會建議您不要這樣做。

有幾件事情你的代碼錯誤：

不能使用[]運營商在全球範圍內，你必須後綴一個對象，所以你可以說window["opener"]這將相當於window.opener，但有沒有這樣的事情根本["window"]
當瀏覽嵌套的屬性，如window.opener.document不能導航使用[]運營商多層次的。即不允許使用window["opener.document"]。您必須改用window["opener"]["document"]。

來源

2011-10-24 19:04:07

感謝您使用[]的提示您是否看到Aadith和Paul建議訪問字段名的兩種方式中的任何一種偏好？ –

保羅的方法更好。它更快，更優雅。但是，我的方法可以直接使用 - 不需要更改'updateField'函數以外的任何代碼。它不會中斷界面。 =） –

將內聯代碼移入功能，並生成對象名稱

回答

相關問題