2011-11-30 49 views
0

在我的web應用程序的登錄表單中,我使用jQuery交換密碼字段的文本字段,一旦它獲得焦點。它的工作無處不在,除了IE8(和,我假設,下面 - 儘管我沒有檢查)jQuery交換文本字段的密碼字段不工作在IE8

var originalField = $(this);   // Original field 
var newField = $(this).clone();  // New field, cloned from the old one 
newField.attr("type", "password"); // Change the new field's type to password 
newField.insertBefore(originalField); // Insert the new field 
originalField.remove();    // Remove the old one 
newField.attr("id", "password");  // Give new field the id "password" (for CSS) 
newField.select();     // Bring focus to the new field 

的思考?

編輯:對不起,我沒有指定,但IE中的「不工作」意味着該領域根本沒有被取代。當我在IE中輸入密碼字段時,我可以閱讀它的內容。

編輯2:下面是用HTML和JS的小提琴:http://jsfiddle.net/franktisellano/v5D9W/3/

+0

爲什麼它不是在IE8的工作?它不克隆該元素,它是否不插入克隆?它錯誤嗎? –

+1

它究竟做什麼而不是工作? newField.select()應該是newField.focus()嗎? – Maxx

+0

你能設置一個包含HTML以及JS的小提琴嗎? –

回答

0

IE8不允許你改變輸入的類型。在開發工具Error: This command is not supported.<input class="custom" title=Password value="" type=password name=password placeholder="Password">中出現這樣的錯誤。

jquery.placeholder插件通過創建新元素並從舊元素中複製屬性來解決此問題。

function extractAttributes(elem) { 
    var attr = elem.attributes, copy = {}, skip = /^jQuery\d+/; 
    for(var i = 0; i < attr.length; i++) { 
     if(attr[i].specified && !skip.test(attr[i].name)) { 
      copy[attr[i].name] = attr[i].value; 
     } 
    } 
    return copy; 
} 

$clone = $('<input/>') 
    .attr($.extend(extractAttributes(this), {type: 'text', value: placeholder, 'data-password': 1, id: cid})) 
    .addClass('placeholder'); 

https://github.com/matoilic/jquery.placeholder/blob/master/jquery.placeholder.js#L80-L82