切换隐藏/显示表td在.htta

我看过一些关于这个主题的帖子，但是我没有设法解决我自己的问题，尽管我尝试了不同的方法。

我在一个。hta文件中编程，在那里我有我所有的笔记标题彼此上面列出。无论何时单击注释标题，描述都应该出现在标题下(切换/展开)。所有的笔记都应该隐藏起来。

sub searchdata
    SQL_query = "SELECT * FROM dvd WHERE Title LIKE '%"& txtsrch.value &"%' OR Notes LIKE '%"& txtsrch.value &"%' ORDER BY Title"
    Set rsData = conn.Execute(SQL_query)
    strHTML2 = strHTML2 & ""
    Do Until rsData.EOF = True
    strHTML2 = strHTML2 & "<table width='97%' border='0' id='bodytext' style='border-bottom: solid #000000 1px;'><tr><span class'togglelink'><td width='70%' style='cursor: pointer'><b>" & rsData("Title") & "</b></td></span><td align='right' style='color: #000'>" & rsData("Cat") & "&nbsp; <a href='#' onclick='editUser("& rsData("ID") &")' language='vbscript'><img src='images/arrow-blue.png' border='0' title='Rediger notatet' /></a>&nbsp;<a href='#' onclick='deleteUser("& rsData("ID") &")' language='vbscript'><img src='images/slet.png' border='0' title='Slet notatet' /></a></td><tr><span class='toggle' style='display: block'><td colspan='2'>" & rsData("Notes") & "</td></span></tr></table>"
    rsData.moveNext ' go to next record
    Loop
    strHTML2 = strHTML2 & ""
    searchIT.innerHTML = strHTML2
end sub

我使用这个JS脚本来运行它:

<script type="text/javascript">
$(document).ready(function () {
    $('.toggle').hide();
    $('span.togglelink').on('click', function (e) {
        e.preventDefault();
        var elem = $(this).next('.toggle')
        $('.toggle').not(elem).hide('fast');
        elem.toggle('fast');
    });
});
</script>

在测试纯文本时，我可以很容易地让脚本工作。JSFiddle

附带问题:在HTA中编程真的与HTML有很大不同吗?我遇到了很多问题，试图转换我的整个网站(MySQL, PHP, HTML)在HTA工作。

提前感谢!

更新:列出我的整个。hta脚本:

<html>
<HTA:APPLICATION ID="oHTA"
     APPLICATIONNAME="myApp"
     BORDER="thick"
     CAPTION="yes"
     ICON=./images/Icon.ico
     MAXIMIZEBUTTON="yes"
     MINIMIZEBUTTON="yes"
     SHOWINTASKBAR="yes"
     SINGLEINSTANCE="no"
     SYSMENU="yes"
     RESIZE="yes"
     VERSION=7.2
     WINDOWSTATE="normal"
     contextMenu=no
  >
<head>
<style>
#vis1{
    display:none;
}
</style>
<script type="text/javascript"> // Width and height in pixel to the window
    window.resizeTo(683,725);
</script>
<script type="text/javascript">
var enablepersist="on" //Enable saving state of content structure using session cookies? (on/off)
var collapseprevious="Yes" //Collapse previously open content when opening present? (yes/no)
if (document.getElementById){
document.write('<style type="text/css">')
document.write('.switchcontent{display:none;}')
document.write('</style>')
}
function getElementbyClass(classname){
ccollect=new Array()
var inc=0
var alltags=document.all? document.all : document.getElementsByTagName("*")
for (i=0; i<alltags.length; i++){
if (alltags[i].className==classname)
ccollect[inc++]=alltags[i]
}
}
function contractcontent(omit){
var inc=0
while (ccollect[inc]){
if (ccollect[inc].id!=omit)
ccollect[inc].style.display="none"
inc++
}
}
function expandcontent(cid){
if (typeof ccollect!="undefined"){
if (collapseprevious=="yes")
contractcontent(cid)
document.getElementById(cid).style.display=(document.getElementById(cid).style.display!="block")? "block" : "none"
}
}
function revivecontent(){
contractcontent("omitnothing")
selectedItem=getselectedItem()
selectedComponents=selectedItem.split("|")
for (i=0; i<selectedComponents.length-1; i++)
document.getElementById(selectedComponents[i]).style.display="block"
}
function get_cookie(Name) { 
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) { 
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function getselectedItem(){
if (get_cookie(window.location.pathname) != ""){
selectedItem=get_cookie(window.location.pathname)
return selectedItem
}
else
return ""
}
function saveswitchstate(){
var inc=0, selectedItem=""
while (ccollect[inc]){
if (ccollect[inc].style.display=="block")
selectedItem+=ccollect[inc].id+"|"
inc++
}
document.cookie=window.location.pathname+"="+selectedItem
}
function do_onload(){
uniqueidn=window.location.pathname+"firsttimeload"
getElementbyClass("switchcontent")
if (enablepersist=="on" && typeof ccollect!="undefined"){
document.cookie=(get_cookie(uniqueidn)=="")? uniqueidn+"=1" : uniqueidn+"=0" 
firsttimeload=(get_cookie(uniqueidn)==1)? 1 : 0 //check if this is 1st page load
if (!firsttimeload)
revivecontent()
}
}

if (window.addEventListener)
window.addEventListener("load", do_onload, false)
else if (window.attachEvent)
window.attachEvent("onload", do_onload)
else if (document.getElementById)
window.onload=do_onload
if (enablepersist=="on" && document.getElementById)
window.onunload=saveswitchstate
</script>
<title>Søgning</title>
<link href="stylesheet/stylesheet.css" rel="stylesheet" type="text/css" />
<link rel="SHORTCUT ICON" href="images/icon.ico"/>
<script type="text/javascript" charset="utf-8" src="jquery/jquery-1.7.min.js"></script>
<script language="vbscript">
Dim conn 'GLOBAL doing this here so that all functions can use it
sub dotheconnection
    Set conn = CreateObject("ADODB.Connection")
    conn.Open "Provider=Microsoft.Jet.OLEDB.4.0; Data Source =./Database/data.mdb; User Id=; Password="
    If conn.errors.count <> 0 Then 

    else
        ' if connected OK call sub getdata
        getdata
    end if
end sub
sub getdata
    SQL_query = "SELECT * FROM dvd ORDER BY Title"
    Set rsData = conn.Execute(SQL_query)
    strHTML = strHTML & ""
    Do Until rsData.EOF = True
    strHTML = strHTML & "<table width='97%' border='0' id='bodytext' style='border-bottom: solid #000000 1px;'><tr><td width='70%' style='cursor: pointer'><span id='vis'><b>" & rsData("Title") & "</b></span></td><td align='right' style='color: #000'>" & rsData("Cat") & "&nbsp; <a href='#' onclick='editUser("& rsData("ID") &")' language='vbscript'><img src='images/arrow-blue.png' border='0' title='Rediger notatet' /></a>&nbsp;<a href='#' onclick='deleteUser("& rsData("ID") &")' language='vbscript'><img src='images/slet.png' border='0' title='Slet notatet' /></a></td><tr><td colspan='2'><span id='vis1'>" & rsData("Notes") & "</span></td></tr></table>"
    rsData.moveNext ' go to next record
    Loop
    strHTML = strHTML & ""
    SQL_query = "SELECT Count(*) AS intTotal FROM dvd"
    Set rsData = conn.Execute(SQL_query)
    strHTML1 = strHTML1 & ""
    strHTML1 = strHTML1 & "" & rsData("intTotal") & " "
    Count.innerHTML = strHTML1
end sub
sub searchdata
    SQL_query = "SELECT * FROM dvd WHERE Title LIKE '%"& txtsrch.value &"%' OR Notes LIKE '%"& txtsrch.value &"%' ORDER BY Title"
    Set rsData = conn.Execute(SQL_query)
    strHTML2 = strHTML2 & ""
    Do Until rsData.EOF = True
    strHTML2 = strHTML2 & "<table width='97%' border='0' id='bodytext' style='border-bottom: solid #000000 1px;'><tr><span class'togglelink'><td width='70%' style='cursor: pointer'><b>" & rsData("Title") & "</b></td></span><td align='right' style='color: #000'>" & rsData("Cat") & "&nbsp; <a href='#' onclick='editUser("& rsData("ID") &")' language='vbscript'><img src='images/arrow-blue.png' border='0' title='Rediger notatet' /></a>&nbsp;<a href='#' onclick='deleteUser("& rsData("ID") &")' language='vbscript'><img src='images/slet.png' border='0' title='Slet notatet' /></a></td><tr><span class='toggle' style='display: block'><td colspan='2'>" & rsData("Notes") & "</td></span></tr></table>"
    rsData.moveNext ' go to next record
    Loop
    strHTML2 = strHTML2 & ""
    searchIT.innerHTML = strHTML2
end sub
sub deleteUser(id)
    If MsgBox("Vil du slettet dette notat?", vbYesNo) =vbYes Then       
    SQL_query = "DELETE * FROM dvd WHERE ID = " & id
    conn.Execute(SQL_query)
    getdata
    reloadpage()
Else
    MsgBox("Notatet er ikke blevet slettet.")
End IF
end sub
sub addUser
    SQL_query = "INSERT INTO dvd (Title,Length,Notes,Cat) VALUES ('"& txtTitle.value &"','"& txtLength.value &"','"& txtNotes.value &"','"& txtCat.value &"')"
    conn.Execute(SQL_query)
    reloadpage()
    expandcontent("sc2")
    getdata
end sub
sub editUser(id)
    SQL_query = "SELECT * FROM dvd WHERE ID=" & id
    Set rsData=conn.Execute(SQL_query)
    txtTitle.value = rsData("Title")
    txtLength.value =   rsData("Length")
    txtNotes.value =    rsData("Notes")
    txtCat.value =  rsData("Cat")
    txtID.value = rsData("ID")
    btnUpdate.disabled = false // Show
    btnOpret.disabled = true // Hide
    expandcontent("sc2")
    getdata
end sub

sub updateUser
    SQL_query = "UPDATE dvd SET Title='"& txtTitle.value &"', Length='"& txtLength.value &"' , Notes='"& txtNotes.value &"', Cat='"& txtCat.value &"' WHERE ID= " & txtID.value 
    conn.Execute(SQL_query)
    getdata
    reloadpage()
    expandcontent("sc2")
end sub

</script>
<script type="text/javascript" charset="utf-8" src="jquery/jquery-1.7.min.js"></script>
<SCRIPT TYPE="text/javascript">
function init()
{
dotheconnection();
searchdata();
getdata();
}
</SCRIPT>
    <script>
function addNotat() {
    btnOpret.disabled = false; // Show
    btnUpdate.disabled = true; // Hide
    expandcontent("sc2");
}
</script>
<script>
function reloadpage() {
    location.reload();
}
</script>
<script type="text/javascript">
$(document).ready(function () {
    $('.toggle').hide();
    $('div.togglelink').on('click', function (e) {
        e.preventDefault();
        var elem = $(this).next('.toggle')
        $('.toggle').not(elem).hide('fast');
        elem.toggle('fast');
    });
});
</script>
</head>
<body onLoad="init()" language="vbscript">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="40" width="20%" id="top_bar">
<input language="vbscript" onload="searchdata" onkeyup="searchdata" name="txtsrch" id="filter_input" width="15%" tabindex="0" autofocus="autofocus" size="35" type="search" style="background: url(images/search_bg.png) #FFF no-repeat left; padding-left: 20px; margin-left: 10px" placeholder="Søgning">&nbsp;</td>
<td id="top_bar"></div><span id="Count"></span> notater </td>
<td width="22%" id="top_bar" align="right"><input type="button" style="margin-right: 10px" onClick="history.go(0)" value="Opdater"><a onClick="addNotat()" style="cursor: hand">Opret</a>&nbsp;</span></td>
<td width="20%" id="top_bar" align="right"><a href="" target="_blank"><img src="images/footer-logo.png" style="margin-right: 10px" border="0" title="Gå til forsiden" /></a></td>
</tr>
</table>
<br>
<div id="sc2" class="switchcontent" style="margin-left: 10px">
<b>Title:<br></b><input type="text" name="txtTitle" size="43"><br>
<b>Kategori:</b><br>
<select size="1" name="txtCat">
    <option value="">Vælg kategori</option>
    <option value="Thriller">Thriller</option>
    <option value="Westerns">Westerns</option>
</select><br>
<b>Length</b><br><input type="text" name="txtLength" size="8"><br>
<b>Notat:</b><br><textarea rows="6" name="txtNotes" cols="55"></textarea><br>
<p align="left"><b>
<input type="button" name="btnOpret" value="Opret" onclick="addUser" language="vbscript" disabled>
<input type="button" name="btnUpdate" value="Gem" onclick="updateUser" language="vbscript" disabled>
<input type="hidden" name="txtID">
</b></p>
</div>
</div>
<div id="searchIT" style="margin-left: 10px"></div>
</body>
</script>

</html>

div.togglelink 's将在文档加载后附加，您的on -处理程序将仅对文档加载时存在的元素有效。

将处理程序附加到主体上:

$('body').on('click','span.togglelink',function(){/*your callback*/});

相关内容

最新更新

热门标签：