编写 Jacada 交互扩展答案

【问题标题】：writing a Jacada Interaction extension编写 Jacada 交互扩展
【发布时间】：2015-06-04 00:37:21
【问题描述】：

我想为 Jacada 交互创建一个“扩展”（以扩展功能），在我的例子中，将 serialNumber 的数字部分（一个字母，后跟数字）解析并分配给一个数字全局（“系统”）变量，比如serialNumeric。我缺少的是使这项工作的结构和语法，包括从扩展中引用交互变量的方式。

这是我失败的尝试，在失败后将行注释掉以使其无害；我想我删除了“返回页”；崩溃后，仍然崩溃：

initExtensions("serialNumeric", function(app){
    app.registerExtension("loaded", function(ctx, page) {
        // Place your extension code here
        //$('[data-refname="snum"]').val('serialNumber');        
        // snum = Number(substring(serialNumber,1))
    });
});

这是一个有效的例子：

/**
 * Description: Add swiping gestures to navigate the next/previous pages 
 */
initExtensions("swipe", function(app) {
    // Swipe gestures (mobile only)
    app.registerExtension('pageRenderer', function(ctx, page) {
        page.swipe(function(evt) {            
            (evt.swipestart.coords[0] - evt.swipestop.coords[0] > 0)  
                ? app.nextButton.trigger('click')
                : app.backButton.trigger('click')
        });
        return page;
    });
});

阅读下面的评论后，我尝试了以下操作，但未成功（修改后的问题变量未写回该变量）。它在评论部分表现不佳，所以我把它放在这里：

    initExtensions("serialNumeric", function(app){
        app.registerExtension("loaded", function(ctx, page) {
            var sernum = new String($('[data-refname="enter"] input'));
            var snumeric = new String(sernum.substr(1));
            $('[data-refname="enter"] input').val(snumeric);
        });
    });

我想了解这段代码何时运行：分配变量时运行似乎是合乎逻辑的。感谢您的任何见解〜

【问题讨论】：

标签： callback extension-methods interaction

【解决方案1】：

在您的情况下，您扩展 loaded 事件。您不必像下面的工作示例中那样从扩展返回页面。

page 参数包含您刚刚加载的页面的 DOM，ctx 参数包含 JSON 格式的页面数据。您可以在浏览器的检查工具中检查这两个参数的内容。我喜欢铬。在 Windows 上按 F12 或在 Mac 上按 Shift+Ctrl+I。

选择器$('[data-refname="snum"] input') 将为您提供问题的输入字段，名称为您在设计器中定义的snum。然后，您可以将值与来自 serialNumber 变量的值一起放在输入字段中。

$('[data-refname="snum"] input').val(serialNumber);

你也可以用同样的方式读取值。

您不能（此时）访问扩展程序中的交互变量，除非您将这些变量放在问题字段中。

【讨论】：

我已经设置了一个测试交互，其中一个问题元素导致一个显示问题变量的语句元素。我在下面写的内容未能对问题变量进行赋值。你能指出我做错了什么吗？非常感谢。这是不起作用的： initExtensions("serialNumeric", function(app){ app.registerExtension("loaded", function(ctx, page) { var sernum = new String($('[data-refname="enter" ] input')); var snumeric = new String(sernum.substr(1)); $('[data-refname="enter"] input').val(snumeric); }); });

【解决方案2】：

这是一个简单的示例，如何以编程方式将您自己的值放入输入字段并使其读取到模型中，以便接下来将其发送到服务器。欢迎您尝试更复杂的选择器以适应您自己的表单。

initExtensions("sample", function(app){
    
    app.registerExtension("loaded", function(ctx, page) {        
        // simple selector
        var i = $('input');        
        // set new value
        i.val('some new value');
        // cause trigger so we can read into our model
        i.trigger('change');
    });    
   
});

【讨论】：