javascript - 单击 Div 后将值放入文本框

Question

我目前正在尝试为我的页面制作壁纸更换器。

目前，我想在单击 CSS 菜单中相应的 DIV 选项时将壁纸的 URL 放入文本框中。

这是我的 JQuery

$("div.bg8").click( function() {
var BackgroundURL = 'Styles/hongkongskyline.jpg'; 
var TheTextBox = document.getElementById('<%=BackgroundsTxt.ClientID%>'); 
TheTextBox.value= BackgroundURL; 
alert('This has worked'); }); 

..和我的 HTML...

 <ul><li class="#cssmenu"><a>
  <div id="bg8" runat="server">
    <table style="height: 16px; width:33%;"> 
     <tr>
     <td>
     <img src='Styles/hongkongskyline.jpg' width="34px" height="32px" /></td>  <td>Hong Kong Skyline                                                                                       </td> 
     </tr> 
    </table>
   </div>
</a></li></ul>

不幸的是，当我单击 DIV 时似乎没有发生任何事情..

有人发现我看不到的问题吗？

非常感谢。

Answer 1

这里有几个问题。

首先，您并不是在 jQuery 中引用 div 的 ID - 您引用的是一个名为 bg8 的类。试试这个:

$("#bg8")...

接下来，您将一些本地 dom 内容混合到您的 jQuery 中。而不是

document.getElementById('<%=BackgroundsTxt.ClientID%>'); 

尝试

$("#<%=BackgroundsTxt.ClientID%>");

并确保通过查看页面源来解析 ID。

最后，设置文本框的值:

theTextBox.val(BackgroundURL);

你的整个功能可能是

$("#bg8").click( function() {
    $("#<%=BackgroundsTxt.ClientID%>").val('Styles/hongkongskyline.jpg'); 
    alert('This has worked');
}); 

我的策略是在进入真正的逻辑之前使用简单的警报测试事件处理程序。