如何显示/隐藏列表项目中的项目MVVM剑道

How to show/hide item within a list item MVVM kendo

本文关键字:项目 列表 剑道 MVVM 隐藏 何显示 显示      更新时间:2023-09-26
<script type="text/x-kendo-tmpl" id="my-template">
    <ul >
        <li>
        <div onclick="showToggle()"> Show/Hide Form</div>
        <div id="myform"> My Form Stuff</div>
        </li>
    <ul>
</script>

在上面的例子中,我想点击div或者按钮来切换列表项的其他部分

            <ul data-role="listview" id="myList"
                data-bind="source: listOfStuff"
                data-template="my-template"></ul>

现在我不能给它分配id。我只是想用下面的一些功能来切换它。也许这更像是一个javascript问题。我想我也可以在我的mvvm中添加另一个变量到我的对象列表中,然后在单击时将其设置为可见的,但我宁愿不添加到视图模型上。

function showToggle(){
if ( $('#myform') visible) do
   $('#myform').hide();
else 
  $('#myform').show();
}

您可以使用jQuery On为所选元素附加一个或多个事件的事件处理函数。为div设置类选择器,并为该类注册点击处理程序。

<script type="text/x-kendo-tmpl" id="my-template">
<ul >
    <li>
    <div class="show-hide"> Show/Hide Form</div>
        <div>My Form Stuff</div>
    </li>
<ul>

$('.show-hide').on('click', function(e) {
    console.log( e ); // e is div 
});