splice() 不更新 knockout.js 中数组的项目顺序

2024-06-25

之前的帖子 https://stackoverflow.com/questions/10258086/how-do-i-swap-two-items-in-an-observablearray关于如何更新数组的顺序。我遵循 Michael Best 的建议,并使用 splice() 来修改按钮单击时数组的顺序

self.moveup = function (itemIndex) {
    var i = self.itemList.indexOf(itemIndex); 
    if(i >= 1){
     var array = self.itemList();
        self.itemList.splice(i-1, 2, array[i], array[i-1]);
    } 

我遇到麻烦的地方是增加数组中的项目。从阅读Array Splice的用法 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice第一个参数指示应该在哪里进行更改以便向上移动,我认为这将是i+1,值 2 表示数组中有多少项会发生变化,因此没有变化,然后我认为范围将是选定的项 array[i] ,随着我增加位置,结尾将是 [i+1] 。

self.itemList.splice(i+1, 2, array[i], array[i+1]);

在附加的提琴手中,您可以看到值增加,但项目实际上并没有改变顺序,它们只是在您按下向下按钮时复制。我预计结果与调用 moveUp 时的结果相同。

如果有任何关于我在这里缺少的内容的指示,我将不胜感激。http://jsfiddle.net/rlcrews/SCWmk/5/ http://jsfiddle.net/rlcrews/SCWmk/5/

-cheers


差不多了。我是这样做的。 http://jsfiddle.net/MattiasBuelens/jA9sS/

当向上移动一个项目时,您需要将其与前一个项目交换。因此,您需要替换索引处的元素i-1 and i with array[i] and array[i-1], 分别。你的moveup方法正是这样做的,所以一切都很好。

现在,当向下移动一个项目时,您需要将其与next物品。因此,您可以替换索引处的元素i and i+1 with array[i+1] and array[i], 分别。但是您的代码更改了元素i+1 and i+2,这不好。相反,你应该这样做:

self.itemList.splice(i, 2, array[i+1], array[i]);

你开始拼接i(当你删除元素时i and i+1)并将它们替换为(在该索引处插入)array[i+1] and array[i].

另一方面,您对是否可以向下移动该项目的检查是不正确的。唯一不应该向下移动的项目是最后一项,即索引处的元素self.itemList().length-1。因此,检查应该看起来像if (i < array.length - 1) { ... }(见小提琴)。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

splice() 不更新 knockout.js 中数组的项目顺序 的相关文章

  • jQuery:通过子项进行动画、连续循环

    接近但还没有完全实现 我想让第一个子 div 显示几秒钟 向下滑动 通过定位 并淡出视图 然后下一个子 div 向上滑动并淡入视图 连续重复 在显示最后一个子项后循环返回 看起来我已经让循环正常工作了 尽管计数似乎将子 div 堆叠在一起
  • 在画布中心写入 (0,0)-HTML5

    I m currently developing a drawing app which allows the user to click and drag to determine the size of the shape and al
  • 如何在 js.erb 中使用 Ruby 代码?

    我可以使用以下方式在模态中渲染部分内容escape javascript在js erb文件代码中 body append my modal modal show 但是 我似乎无法获得以下结果 console log ERB 将输出一个纯字符
  • 使用 IE 11 和 AngularJS 的 2 路数据绑定问题

    我最近在使用 AngularJS 的 Web 应用程序上构建了一个功能 但在 IE 11 上遇到了一些问题 apply 将数据更改写入 DOM 由于某种原因 这种情况仅有时发生 而当我尝试调试问题时却从未发生 这使得它看起来像是一个计时问题
  • 客户端 GitHub 身份验证

    我正在使用 Javascript 对 GitHub 进行基本身份验证 例如 以下 shell 命令从 Github 获取令牌 curl i u uaername password k d scopes repo https api gith
  • 如何在 Bootstrap 中将单选按钮设置为“选中”? [复制]

    这个问题在这里已经有答案了 我使用 Bootstrap 按钮作为单选按钮 http getbootstrap com javascript buttons http getbootstrap com javascript buttons 这
  • 如何捕获jquery中的任何点击事件[重复]

    这个问题在这里已经有答案了 我有一个按钮 当单击它时 会显示一个带有图像的 div 例如聊天的表情符号面板 如果我再次单击它 div 会隐藏 但我想要做的是 如果 div 已经显示 然后我单击页面的任何其他内容 我想隐藏它 我试过这个 my
  • JavaScript 变量带有一个我需要在 Html.ActionLink 中使用的 ID

    我的 jQuery 代码中有一个 JavaScript 变量 其中包含一个我需要在我的Html ActionLink但它不起作用 Html ActionLink Genomf r AnswerForm AnswerNKI new id go
  • $(document).ready 回调何时执行?

    假设我们附加一个 click http api jquery com click 锚点的处理程序 a 中的标签 document ready http api jquery com ready 打回来 该处理程序将取消默认操作 遵循href
  • 将新数据添加到 d3 Streamgraph 时的转换

    我使用d3绘制了一个与官方示例非常相似的流图http bl ocks org mbostock 4060954 http bl ocks org mbostock 4060954 唯一的区别是我如何用新数据更新它 我不仅想要垂直 y 值 过
  • 有效 JSON 上的 Firefox JSON“格式不正确”错误

    我在 Firefox 中收到以下错误消息 Error not well formed Source File http school courses booking add php 1287657494723 Line 1 Column 1
  • 在 Javascript 中隐藏按钮

    在我最新的程序中 有一个按钮 单击时会显示一些输入弹出框 这些框消失后 如何隐藏按钮 You can set its visibility财产 http www w3schools com cssref pr class visibilit
  • 如何在 Google 地图上旋转叠加图像?

    我正在尝试将一系列叠加层放置到 Google 地图上 我正在跟随地面覆盖层的示例代码 https developers google com maps documentation javascript examples groundover
  • javascript 中的工厂模式与构造函数模式[关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 我看到了关于 javascript 设计模式的教程 虽然教程很好 但它给我留下了很少的问题 正如我所见 工厂和构造函数产生相同的结果
  • 如何在传单地图上显示热图

    我想在我的传单地图上显示热图 我使用了 heatmap jshttps github com pa7 heatmap js https github com pa7 heatmap js但它最终只是显示 未捕获的类型错误 无法分配给只读属性
  • 从数组中删除空字符串,同时保持记录而不循环?

    这个问题在这里被问到 从数组中删除空字符串 同时保留非空字符串的索引记录 https stackoverflow com questions 18113243 remove empty strings from array while ke
  • execCommand 的替代品

    我希望创建一个所见即所得编辑器 使用 jQuery 作为框架 我可以使用不同的方法来简化生产 我现在确实有一个正在工作的编辑 而且运作良好 我使用 iFrame 并将其设计模式设置为打开并从那里开始 然而 有一些事情困扰着我 以更改所选文本
  • 如何从 Instagram 的 media_preview 原始数据重新创建预览?

    如果您从 Instagram 的 API 获取 JSON 数据 您会发现media previewkey 其值是一些 Base64 编码的数据 它看起来确实像一些非常小的预览二进制数据 也许是压缩的 Take 这个帖子 https www
  • Javascript - HTML Canvas 上的 Gecko 边框半径自适应(CSS border-radius)

    我试图弄清楚如何将 border radius css 属性的行为重现到 HTML 画布中 所以我已经在 J avascript 中做了一些事情 以便使用特定的半径 对于每个角 来计算给定形状的正确边界 如果需要的话 这是上一个问题 Gec
  • JavaScript 模板文字稍后替换变量(在知道值之前)

    是否可以在已知值之前以某种方式使用模板文字 JS 模板文字的每个演示都如下所示 var name John var s Hello name 但在现实世界中 模板是在我们知道变量值之前定义的 某处定义了模板 在页面加载时 var s Hel

随机推荐

  • 内存泄漏 - 每个请求命中容器中运行的 Flask API 后

    我有一个 Flask 应用程序在 EC2 上的容器中运行 启动容器时 docker 统计数据显示内存使用量接近 48MB 进行第一次 API 调用 从 s3 读取 2GB 文件 后 使用量上升至 5 72GB 即使 api 调用完成后 使用
  • 使用空子文档集合保存 Mongoose 文档会导致重复键错误

    我有两个猫鼬模式 var productSchema new Schema name type String required true unique true var categorySchema new Schema products
  • 如何使用org.apache.commons包?

    在各种网络示例中 我看到了导入 例如 import org apache commons net ftp FTPClient 我不明白如何使用这些 而且 apache 网站也相当不清楚 我该如何使用这些类 我希望我需要下载一些东西 但如果有
  • 更改 iterm2 中的用户名、主机名和路径颜色

    如何更改 iTerm2 中的用户名 主机名和路径颜色 我正在使用内置的 Solarized 配色方案 In Ubuntu the same built in colorscheme is highlighted like In iTerm2
  • 不同智能手机上的视频观看行为(具有不同的怯场)

    我使用 videoview 或 MediaPlayer 在同一活动的多个视频视图中播放 rtsp 流时遇到兼容性问题 我就这个问题提出了另一个问题here https stackoverflow com questions 21111511
  • 当远程(Http)文件更改时如何执行操作?

    我想创建一个脚本 用于检查 URL 并在远程文件的 Last Modified 标头更改时执行操作 下载 解压缩 我考虑过使用curl 获取标头 但随后我必须将其存储在每个文件的某个位置并执行日期比较 有没有人对使用 大部分 标准 UNIX
  • 调用 logger.setLevel 时使用变量

    有谁知道是否有办法在Python Logging 模块的setlevel 函数中使用变量 目前我正在使用这个 Log logging getLogger myLogger Log setLevel logging DEBUG 但我想要这个
  • 在Android上动态添加imageView

    我想显示 HTML 中的图像 并且使用以下命令获取图像 url 源Jsoup 但是 一个问题是每个帖子都有不同数量的图片 所以 我无法修复 xml 布局中 ImageView 的数量 经过研究 我知道我可以动态创建 ImageView 所以
  • 为什么 event.bubbles 对于“focusin”和“focusout”为假?

    几分钟前 我回答了这个问题 jQuery 中 focusin focusout 与 focus blur 有什么区别 https stackoverflow com q 10584042 601179 答案是 简短回答 focusin气泡
  • 为什么 ggplot2 图例不结合手动填充和缩放值?

    预期行为 如果我用 ggplot2 创建一个绘图并使用单独的形状和填充比例来描绘数据 我希望图例会在 白色 填充点 看起来是空心的 和 黑色 填充点 看起来不空洞的 在下面的示例代码中 Windows 的图例项应为白色空心点 Linux 的
  • Sharepoint 2013 网站 NTLM 身份验证 javascript doPostBack 在 Safari 和 iPad 中不起作用

    我有一个非常有趣的问题 我们有一个使用 sharepoint 2013 创建的站点 我们使用 Windows NTLM 身份验证 在包含自定义讨论列表WebPart 的页面中 我们有一个过滤器按钮 它使用 javascript doPost
  • 为什么 Javascript 不支持lookbehind断言?

    最近我意识到 因有些尴尬 正则表达式lookbehind assertions were not可能在Javascript 这种看似常见的断言不存在的 事实 原因是什么 我意识到也许有其他方法可以实现同样的目标 https stackove
  • 将字符串转换为可绘制对象

    我想发出一个通知 在状态栏中显示一个图标 到目前为止一切顺利 但实际上我希望这个图标是一个 3 个字符的字符串 所以我的问题是 有没有办法将我的字符串转换为Drawable将其显示为状态栏中的图标 编辑 我最近发现了一个具有类似功能的应用程
  • 生成所有尺寸的android图标[关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我想知道 是否有任何工具可以生成所有尺寸的 android 图标 如 hdpi lpdi xxhdpi
  • 有没有办法让 saveAll() 删除无关的对象?

    我的主机对象有许多与其关联的选项对象 在编辑表单中 用户可以选择 取消 选择选项并保存新的关联集 这是通过对发布的数据使用 saveAll 来实现的 结果是 主机 主 对象已更新 更新先前关联和新关联中包含的选项 关联 对象 并且 将创建未
  • Objective-C 中的前向声明枚举

    我在 Objective C 程序中的枚举可见性方面遇到问题 我有两个头文件 其中一个定义了typedef enum 另一个文件需要使用typedef d type 在直C中 我会简单地 include另一个头文件 但在 Objective
  • 如何消除错误 服务无效 请检查您的设置并尝试

    我一直在努力工作 一切都很顺利 只是突然间 当我尝试构建我的项目时 我在 xCode 中收到以下错误 1 在构建时的警报框中 服务无效 请检查您的设置并重试 0xE8000022 只需重新启动您的 iPod 或 iPhone 即可
  • const_cast 的奇怪行为[重复]

    这个问题在这里已经有答案了 考虑以下代码 我声明了一个新的引用端 通过 const cast 将其分配给 a 值 然后我只需增加参考值打印地址和值 include
  • 如何在iis上部署React Next.JS?

    我有一个带有 Next Js 的 React Web 应用程序 我想将其上传到我的 IIS ftp 上 我应该复制 next 文件夹吗 如果是 为什么我在这种情况下会出错 错误截图 您可以在服务器上创建一个本地主机并将请求重定向到该本地主机
  • splice() 不更新 knockout.js 中数组的项目顺序

    继之前的帖子 https stackoverflow com questions 10258086 how do i swap two items in an observablearray关于如何更新数组的顺序 我遵循 Michael B