輸入forcus僅在firefox和chrome（不在IE）中的1/2字段上工作

問題是，焦點函數只處理「名稱」（第一個）而不是「電子郵件」（第二個）。當它聚焦時，它應該改變背景的位置，從而形成一個黃色的邊框，這對第一個邊界來說再次正常工作。輸入forcus僅在firefox和chrome（不在IE）中的1/2字段上工作

這裏是JS：

$("#formLeft input").focus(function() { 
    $(this).parent().addClass("active"); 
    }); 
    $("#formLeft input").blur(function() { 
    $(this).parent().removeClass("active"); 
    });

CSS

#formLeft { 
width: 320px; 
float: left; 
} 
#formLeft input { 
    width: 250px; 
    border: none; 
    text-align: left; 
    background: none; 
    margin: 13px 0 0 13px; 
    font-size: 14px; 
} 
#formLeft .input-bg { 
    background: url(bilder/input-bg.jpg) top left no-repeat transparent; 
    height: 45px; 
    margin-bottom: 10px; 
    position: relative; 
} 
#formLeft div.active { 
    background: url(bilder/input-bg.jpg) bottom left transparent; 
    height: 45px; 
    margin-bottom: 10px; 
    position: relative; 
}

HTML

<div id="formLeft"> 

      <label for="Name">Name:</label> 
      <div class="input-bg"> 
       <input type="text" name="Name" id="Name" class="required" minlength="2" /> 
      </div> 


      <label for="Email">Email:</label> 
      <div class="input-bg"> 
       <input type="text" name="Email" id="Email" class="required email" /> 
      </div> 

     </div>

提前感謝！

來源

2012-02-03 user1188181

你可以發佈input-bg.jpg的實際路徑嗎？這將使測試更容易。 – j08691 2012-02-03 18:36:28

如果我的答案解決了你的問題，你應該接受它作爲答案。如果沒有，讓我知道，我會幫你弄清楚什麼是錯的。 – Jason 2012-02-05 19:43:10

這裏是你想要的工作秩序什麼的jsfiddle：

我加入jQuery的onReady，以確保他們坐上開往thier重點處理程序之前的元素存在。

http://jsfiddle.net/yxnFL/4/

我改變了圖像的色彩，這樣我就可以看到它是否工作不正常。我的猜測是，如果你仍然有問題，這是你的圖像問題。

來源

2012-02-03 18:33:49 Jason

這是一個答案。 – Jason 2012-02-03 18:45:13

感謝您的回答，但我仍然無法完成工作。在Dreamweaver中的「實時視圖」功能中，它也可以工作，也可以在IE中使用，但不能在Firefox或Chrome中使用。如果它在IE和Dreamweaver中的所有瀏覽器和「名稱」上都起作用，它會如何成爲我的圖片的問題？ – user1188181 2012-02-03 18:50:21

而不是將背景設置爲圖像，將其設置爲一種顏色，看看它是否仍然失敗。如果是這樣，我們需要一些更多的信息來幫助你。你添加了onReady嗎？ $（function（）{// yourstuff}）; ？ – Jason 2012-02-03 18:53:33

焦點功能工作正常。檢查這個小提琴。 http://jsfiddle.net/yxnFL/6/

我已經使用背景顏色進行演示。

如果您可以發佈該「input-bg.jpg」圖片的網址，將會有所幫助。

來源

2012-02-03 18:49:00 Vikas

輸入forcus僅在firefox和chrome（不在IE）中的1/2字段上工作

回答

相關問題