javascript - 切换 .hta 中的表 <td>

标签 javascript html vbscript html-table show-hide

先前问题中给出的答案see here Molle 博士的观点是正确的，但仅适用于 <div> 。我被迫使用<table> 。我发现了另一个脚本，它可以在 VBScript 外部完美运行，但不能在内部运行。

我希望你们中的一些人能再次帮助我。这意义重大。

当将完整 HTA 中的代码放入 HTA 文件并向其附加数据库时，纯 HTML 中的脚本(在 HTML 中进行测试)可以正常工作，但 VBScript 中的脚本却不能正常工作。我怎样才能让里面的也能工作呢？

Javascript

<script>
$(document).ready(function() {
      $('table.detail').each(function() {
        var $table = $(this);
        $table.find('.parent').click(function() {
            $(this).nextUntil('.parent').toggle(); // must use jQuery 1.4 for nextUntil() method
        });

        var $childRows = $table.find('tbody tr').not('.parent').hide();
        $table.find('button.hide').click(function() {
            $childRows.hide();
        });
        $table.find('button.show').click(function() {
            $childRows.show();
        });
    });
});
</script>

完整 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>
<script type="text/javascript"> // Width and height in pixel to the window
    window.resizeTo(683,725);
</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>
$(document).ready(function() {
      $('table.detail').each(function() {
        var $table = $(this);
        $table.find('.parent').click(function() {
            $(this).nextUntil('.parent').toggle(); // must use jQuery 1.4 for nextUntil() method
        });

        var $childRows = $table.find('tbody tr').not('.parent').hide();
        $table.find('button.hide').click(function() {
            $childRows.hide();
        });
        $table.find('button.show').click(function() {
            $childRows.show();
        });
    });
});
</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 & "<table class='detail' border=1 width='97%'><col style='width: 40px;'><col style='width: 80px;'><col style='width: 150px;'><col style='width: 40px;'><thead><tr><th colspan='4' align='left'><button class='show'>Show all</button><button class='hide'>Hide all</button></th></tr></thead>"
    Do Until rsData.EOF = True
    strHTML = strHTML & "<tbody><tr class='parent' style='font-weight: bold;'><td colspan='3'>" & rsData("Title") & "</td><td>" & rsData("Cat") & "</td></tr><tr><td colspan='4'>" & rsData("Notes") & "</td></tr></tbody>"

    rsData.moveNext ' go to next record
    Loop

    strHTML = strHTML & "</table>"

    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 & "<table class='detail' border=1 width='97%'><col style='width: 40px;'><col style='width: 80px;'><col style='width: 150px;'><col style='width: 40px;'><thead><tr><th colspan='4' align='left'><button class='show'>Vis alle</button><button class='hide'>Skjul alle</button></th></tr></thead>"
    Do Until rsData.EOF = True
    strHTML2 = strHTML2 & "<tbody><tr class='parent' style='font-weight: bold;'><td colspan='3'>" & rsData("Title") & "</td><td>" & rsData("Cat") & "</td></tr><tr><td colspan='4'>" & rsData("Notes") & "</td></tr></tbody>"
    rsData.moveNext ' go to next record
    Loop
    strHTML2 = strHTML2 & "</table>"
    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">
function init()
{
dotheconnection();
searchdata();
getdata();
}
</SCRIPT>
    <script>
function addNotat() {
    btnOpret.disabled = false; // Show
    btnUpdate.disabled = true; // Hide
    expandcontent("sc2");
}
</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="searchIT" style="margin-left: 10px"></div><br><br><b>Testing in HTML</b>
<table class='detail' border=1 width='97%'><col style='width: 40px;'><col style='width: 80px;'><col style='width: 150px;'><col style='width: 40px;'><thead><tr><th colspan='4' align='left'><button class='show'>Show all</button><button class='hide'>Hide all</button></th></tr></thead><tbody><tr class='parent' style='font-weight: bold;'><td colspan='3'>Title</td><td>Categori</td></tr><tr><td colspan='4'>Note description</td></tr></tbody></table>
</body>
</script>

</html>

最佳答案

我自己找到了解决方案。

通过使用$(window).load(function () {，脚本被识别。完整的脚本在这里:

<script type="text/javascript">
$(window).load(function () {
      $('table.detail').each(function() {
        var $table = $(this);
        $table.find('.parent').click(function() {
            $(this).nextUntil('.parent').toggle(); // must use jQuery 1.4 for nextUntil() method
        });
        var $childRows = $table.find('tbody tr').not('.parent').hide();
        $table.find('button.hide').click(function() {
            $childRows.hide();
        });
        $table.find('button.show').click(function() {
            $childRows.show();
        });
    });
});
</script>

关于javascript - 切换 .hta 中的表 <td>，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24958517/

上一篇：javascript - 具有 10,000 个节点的 d3.js 树形图

下一篇：javascript - 为什么要使用 context.save 和 context.restore()？

相关文章：

html - 如何格式化 InternetExplorer 对象中的表格？

javascript - 为 Javascript 计算每个方法的平均代码行数

javascript - 类似于亚马逊的文本摘要的淡入淡出效果？

vbscript - VBS 使用 LIKE 比较字符串 "Sub or Function not defined"

javascript - 经典 asp - 由 vbscript 下拉列表填充的 javascript 数组

html - 当 body 模糊时，如何在 body 上显示元素？

javascript - 将特定的 csv 文件读入 html

javascript - 将视频 Blob URL 转换为视频 mp4 文件

html - 当导航栏 Logo 被赋予自定义样式时，导航栏的高度会膨胀

css - 无法在一条水平线上呈现 MVC 复选框/标签组合

©2024 IT工具网  联系我们