草庐IT

javascript - 覆盖 Enter 键的 SELECT 行为

coder 2024-07-20 原文

处理一个或多或少像电子表格一样操作的 HTML 控件 - 具有可编辑数据单元格矩阵。 When it comes to cells derived from a SELECT I'm having an issue getting the correct behavior when that type of cell is selected for edit:

如果我使用其默认格式(大小 = 0)呈现 Select，则用户会得到 Select 的 Enter-key 处理的不当行为:

  • 第一次输入 => 激活对单元格的编辑(显示选择控件)
  • 第二次输入 => 展开选择以显示选项
  • 用户使用向上/向下键进行选择
  • 3rd Enter => 关闭列表。 (问题:此 Enter 对“keydown”事件处理程序是隐藏的)
  • 第 4 次输入 => 需要触发事件监听器以停用单元格编辑。

另一方面，如果选择呈现为列表框(例如，size = 3)，则 Enter 键行为正是我正在寻找的(即上面列表中的#2 和#3)不再需要)，但由于列表现在显示在控件内部(而不是作为弹出窗口)，它会放大单元格/行的大小。

那么，有没有一种方法可以“ Hook ”到上面的第三个 Enter 键事件，或者其他一些相对直接的方法来改变 Select 在处理 Enter 键时的行为？

注意:我们没有使用任何第 3 方库(阅读:jQuery 等)

编辑:这里是事件监听器(通过典型的“addEventListener(...)”附加

this.e_sKeyDown = function(control, event) {
  switch(event.keyCode) {
    case 13:  // enter
      control.blur()
      break
    case 27:  // esc = reset selection to it previous value
      control.setAttribute("data-cancelModify", "true")
      control.blur()
      break
  }
}

第二次编辑:根据评论/建议，我添加/尝试了此操作:

this.e_sOnChange = function(control, event) {
  control.blur()
}

该事件将会触发，但它会针对每个不同的选项触发。换句话说，我似乎无法确定这是用户实际打算选择的选项，还是只是沿途遍历的选项。为了演示，这里是 jquery 站点的任何示例。注意每次上/下时文本是如何变化的，无论输入键是什么:

http://api.jquery.com/change/

已解决:感谢所有评论者的建议。事实上，解决方案(无论如何对于我的情况)是添加一个“keyup”事件监听器。我不能说它适用于哪些浏览器，但它在更高版本的 Chrome 中可以使用。

最佳答案

根据建议，获取“隐藏的”回车键事件的方法是添加一个“keyup”事件监听器；问题已被编辑以反射(reflect)解决方案。

注意:发布此答案只是为了结束问题；请在应有的地方给予表扬 - jesus.tesh 和其他评论者的建议...

关于javascript - 覆盖 Enter 键的 SELECT 行为，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18155863/

javascriptSELECTsection监听器control

有关javascript - 覆盖 Enter 键的 SELECT 行为的更多相关文章

  1. ruby-on-rails - 在混合/模块中覆盖模型的属性访问器 - 2

    我有一个包含模块的模型。我想在模块中覆盖模型的访问器方法。例如:classBlah这显然行不通。有什么想法可以实现吗？ 最佳答案 您的代码看起来是正确的。我们正在毫无困难地使用这个确切的模式。如果我没记错的话，Rails使用#method_missing作为属性setter，因此您的模块将优先，阻止ActiveRecord的setter。如果您正在使用ActiveSupport::Concern(参见thisblogpost)，那么您的实例方法需要进入一个特殊的模块:classBlah

  2. ruby-on-rails - rspec should have_select ('cars' , :options => ['volvo' , 'saab' ] 不工作 - 2

    关闭。这个问题需要detailsorclarity.它目前不接受答案。想改进这个问题吗？通过editingthispost添加细节并澄清问题.关闭8年前。Improvethisquestion在首页我有:汽车:VolvoSaabMercedesAudistatic_pages_spec.rb中的测试代码:it"shouldhavetherightselect"dovisithome_pathit{shouldhave_select('cars',:options=>['volvo','saab','mercedes','audi'])}end响应是rspec./spec/request

  3. ruby - 如果指定键的值在数组中相同，如何合并哈希 - 2

    我有一个这样的哈希数组:[{:foo=>2,:date=>Sat,01Sep2014},{:foo2=>2,:date=>Sat,02Sep2014},{:foo3=>3,:date=>Sat,01Sep2014},{:foo4=>4,:date=>Sat,03Sep2014},{:foo5=>5,:date=>Sat,02Sep2014}]如果:date相同，我想合并哈希值。我对上面数组的期望是:[{:foo=>2,:foo3=>3,:date=>Sat,01Sep2014},{:foo2=>2,:foo5=>5:date=>Sat,02Sep2014},{:foo4=>4,:dat

  4. ruby - 无法覆盖 irb 中的 to_s - 2

    我在pry中定义了一个函数:to_s，但我无法调用它。这个方法去哪里了，怎么调用？pry(main)>defto_spry(main)*'hello'pry(main)*endpry(main)>to_s=>"main"我的ruby版本是2.1.2看了一些答案和搜索后，我认为我得到了正确的答案:这个方法用在什么地方？在irb或pry中定义方法时，会转到Object.instance_methods[1]pry(main)>defto_s[1]pry(main)*'hello'[1]pry(main)*end=>:to_s[2]pry(main)>defhello[2]pry(main)

  5. ruby - 如何根据特征实现 FactoryGirl 的条件行为 - 2

    我有一个用户工厂。我希望默认情况下确认用户。但是鉴于unconfirmed特征，我不希望它们被确认。虽然我有一个基于实现细节而不是抽象的工作实现，但我想知道如何正确地做到这一点。factory:userdoafter(:create)do|user,evaluator|#unwantedimplementationdetailshereunlessFactoryGirl.factories[:user].defined_traits.map(&:name).include?(:unconfirmed)user.confirm!endendtrait:unconfirmeddoenden

  6. ruby - 检查字符串是否包含散列中的任何键并返回它包含的键的值 - 2

    我有一个包含多个键的散列和一个字符串，该字符串不包含散列中的任何键或包含一个键。h={"k1"=>"v1","k2"=>"v2","k3"=>"v3"}s="thisisanexamplestringthatmightoccurwithakeysomewhereinthestringk1(withspecialcharacterslike(^&*$#@!^&&*))"检查s是否包含h中的任何键的最佳方法是什么，如果包含，则返回它包含的键的值？例如，对于上面的h和s的例子，输出应该是v1。编辑:只有字符串是用户定义的。哈希将始终相同。 最佳答案

  7. ruby - 覆盖相似的方法，更短的语法 - 2

    在Ruby类中，我重写了三个方法，并且在每个方法中，我基本上做同样的事情:classExampleClassdefconfirmation_required?is_allowed&&superenddefpostpone_email_change?is_allowed&&superenddefreconfirmation_required?is_allowed&&superendend有更简洁的语法吗？如何缩短代码？ 最佳答案 如何使用别名？classExampleClassdefconfirmation_required?is_a

  8. ruby - 是否可以覆盖 gemfile 进行本地开发？ - 2

    我们的git存储库中目前有一个Gemfile。但是，有一个gem我只在我的环境中本地使用(我的团队不使用它)。为了使用它，我必须将它添加到我们的Gemfile中，但每次我checkout到我们的master/dev主分支时，由于与跟踪的gemfile冲突，我必须删除它。我想要的是类似Gemfile.local的东西，它将继承从Gemfile导入的gems，但也允许在那里导入新的gems以供使用只有我的机器。此文件将在.gitignore中被忽略。这可能吗？ 最佳答案 设置BUNDLE_GEMFILE环境变量:BUNDLE_GEMFI

  9. ruby-on-rails - 事件记录 : Select max of limit - 2

    我正在尝试将以下SQL查询转换为ActiveRecord，它正在融化我的大脑。deletefromtablewhereid有什么想法吗？我想做的是限制表中的行数。所以，我想删除少于最近10个条目的所有内容。编辑:通过结合以下几个答案找到了解决方案。Temperature.where('id这给我留下了最新的10个条目。 最佳答案 从您的SQL来看，您似乎想要从表中删除前10条记录。我相信到目前为止的大多数答案都会如此。这里有两个额外的选择:基于MurifoX的版本:Table.where(:id=>Table.order(:id).

  10. ruby - Ruby gsub 替换中的行为不一致？ - 2

    两个gsub产生不同的结果。谁能解释一下为什么？代码也可在https://gist.github.com/franklsf95/6c0f8938f28706b5644d获得.ver=9999str="\tCFBundleDevelopmentRegion\n\ten\n\tCFBundleVersion\n\t0.1.190\n\tAppID\n\t000000000000000"putsstr.gsub/(CFBundleVersion\n\t.*\.).*()/,"#{$1}#{ver}#{$2}"puts'--------'putsstr.gsub/(CFBundleVersio

随机推荐