求教關於jQuery for迴圈(表單) 個別按鈕變色

頁: [1]

s870887s 發表於 2016-7-3 01:25 AM

本帖最後由 s870887s 於 2016-7-3 05:49 PM 編輯

求教關於jQuery
利用用php for迴圈製作多個相同的form的表單，
希望的達到效果是，當滑鼠觸碰哪個或選擇了下拉式選單後，哪個按鈕就變色
使用了this 的寫法還是答不到效果
目前一直苦思做不出來{:11:}，只能做出點選(觸碰)哪個個別的select，一起變色.........
希望有高人指點{:7:}

測試網頁

HTML如下
<body>
<?php
for($a=0;$a<=3;$a++){
?>
<div class="bb">
<form action="#" method="post">
      <select name="sk">
         <option value="A">A</option>
         <option value="b">b</option>
         <option value="c">c</option>
      </select>
      <input type="submit" value="ENT">
</form>
</div>
<?
}
?>
</body>

程式部分如下

<script>
$(function(){
      $('select',this).mouseover(function(){
         $('input').css("background","#1b8d1b");
      });
});
</script>

變成沒效果的.....
<script>
$(function(){
      $('select',this).mouseover(function(){
         $('input',this).css("background","#1b8d1b");
      });
});
</script>

...<div class='locked'><em>瀏覽完整內容，請先 <a href='member.php?mod=register'>註冊</a> 或 <a href='javascript:;' onclick="lsSubmit()">登入會員</a></em></div><div></div>

theloserbm 發表於 2016-7-5 11:09 AM

$(function(){
$('select').mouseover(function(){
$(this).css("background","#1b8d1b");
});
});this是指被動作的元素, 加上$()就能變成jquery元件了

s870887s 發表於 2016-7-7 09:48 PM

theloserbm 發表於 2016-7-5 11:09 AM static/image/common/back.gif
this是指被動作的元素, 加上$()就能變成jquery元件了

感謝指點，但要變色的按鈕，並不是個別的select

theloserbm 發表於 2016-7-9 03:21 PM

呃... 那用css來做會比較方便些select:hover + input {
background-color: rgb(27, 141, 27);
}

s870887s 發表於 2016-7-9 11:46 PM

theloserbm 發表於 2016-7-9 03:21 PM static/image/common/back.gif
呃... 那用css來做會比較方便些

感謝~這樣的做法是可以，但無法一直處於按鈕變色狀態
努力中{:11:}<br><br><br><br><br><div></div>

theloserbm 發表於 2016-7-11 11:15 AM

雖然不明白為甚麼要這樣做, 不過...$(function(){
$("select").mouseover(function(){
$(this).parent().find('input').css("background","#1b8d1b");
});
});

s870887s 發表於 2016-7-11 11:47 AM

本帖最後由 s870887s 於 2016-7-11 11:56 AM 編輯

theloserbm 發表於 2016-7-11 11:15 AM static/image/common/back.gif
雖然不明白為甚麼要這樣做, 不過...
感謝theloserbm大，這麼用心的教導，辛苦你了，萬分感謝{:7:}

想做這樣的效果是因為，例如我選擇了數量或選項後
做一個提示，給選擇選項後的使用者有個提示效果，
因為有些人真的是不會去按.......
之前承接了一個案子當練習，遇到這樣的問題，
跟你說他不知道要按，能不能讓我選完選項後，
讓我知道要按那個送出的按鈕.....暈...(明明按鈕上就有寫"送出"兩個字)

想說還是練習一下，避免之後又遇到同樣的奇怪問題....

我自己改成，在$("select",this)，多加了this做指定，可獨立選取
mouseover改成了click，按了之後才觸發

<script>
$(function(){
   $("select",this).click(function(){
      $(this).parent().find('input').css("background","#1b8d1b");
   });
});
</script>...<div class='locked'><em>瀏覽完整內容，請先 <a href='member.php?mod=register'>註冊</a> 或 <a href='javascript:;' onclick="lsSubmit()">登入會員</a></em></div>

s870887s 發表於 2016-7-11 02:05 PM

之前是有寫出當選完就直接送出，但這樣就要有已送出的步驟
目前還在研究要怎麼送出前有個提示在視窗上(送出了什麼)，
想著要用php寫還是JQ寫，努力研究中~

頁: [1]

伊莉討論區's Archiver

求教 關於jQuery for迴圈(表單) 個別按鈕變色

求教關於jQuery for迴圈(表單) 個別按鈕變色