切换类原型函数答案

【问题标题】：Toggle Class Prototype Function切换类原型函数
【发布时间】：2014-04-08 14:25:32
【问题描述】：

我正在尝试遍历由类名指定的元素数组。然后我想使用一个函数来切换类并更改一些文本。

这不工作：

$$('.btn').forEach( setButtonLoadingStateOn, this );

setButtonLoadingStateOn = function( btn ) {
    btn.toggleClassName('loading');
    btn.disable();
    btn.select('span span')[0].update( "please wait..." );
}

这不工作：

$$('.btn').each( function(btn) {
    btn.addClassName('loading');
    btn.disable();
    btn.select('span span')[0].innerHTML = "please wait...";
});

这也不工作：

setButtonLoadingState( '.btn', 'start' );

setButtonLoadingState = function( btnClass, loadState ) {
    btnElem = $$( btnClass );

    btnElem.each(function( el ){
        if ( loadState == 'start' ) {
            el.addClassName( 'loading' );
            el.disable();
            el.select('span span')[0].innerHTML = "please wait...";
        } else {
            el.removeClassName( 'loading' );
            el.enable();
            el.select('span span')[0].innerHTML = "buy now";
        }
    });
}

如果我 console.log() 元素，我会得到我期待的对象（或数组），所以我不知道出了什么问题。

我也尝试了几个 SO 答案，包括这个：Add or remove class with prototype

如果重要的话，平台是 Magento CE 1.8.0.2。如何使用 Prototype 更新这些按钮元素？谢谢。

~编辑~

页面上有几个 HTML 元素。它们看起来都是这样的：

<button type="button" title="buy now" class="button btn" onclick="productAddToCart(this)">
    <span><span>Quick Buy</span></span>
</button>

【问题讨论】：

您是否收到任何控制台错误？第二个代码块看起来应该可以工作。您可以发布您要更改的 HTML 吗？
Thx Geek，完全没有控制台错误，也没有服务器错误。我在问题中添加了示例 HTML :)
这段代码什么时候运行，它是productAddToCart函数的一部分吗？它和那个方法一样好运行吗？按钮和跨度是否有可能在设置后立即重置（竞争条件）？将核心元素/脚本放入小提琴 (jsfiddle.net/Kua47/1) 表明它有效，页面上还有其他事情发生。
因此代码可以自行工作 - 意味着页面上的其他内容会影响您的元素 - 您需要进行更多挖掘，或者如果可能的话，发布一个指向您遇到问题的页面的公共链接。
您是否在一个浏览器中看到了这种行为，而不是在另一个浏览器中，或者它会传播？过去我不得不延迟这样的功能，您可能也想尝试一下。（观察提交，用evt.stop() 停止它，然后更改你的类名，然后发送延迟的this.submit()。）如果这解决了它，那是因为浏览器在你按下提交后停止处理对 DOM 的任何更改——你'正在离开页面，因此它不应该改变。

标签： magento prototypejs prototype

【解决方案1】：

非常感谢所有做出贡献的人。 AJAX 请求在 JSON 响应中返回一个连字符键：

{"msg-html":"blah blah blah"}

从响应对象中读取如下是问题：

var ajaxResult = transport.responseText.evalJSON();
var ajaxMsg = ajaxResult.msg-html;

JSON 键中不允许使用连字符，而是需要按如下方式访问对象：

var ajaxMsg = ajaxResult["msg-html"];

... 或删除连字符！再次感谢大家。

感谢这位老兄/老兄：http://developer.appcelerator.com/question/120227/parsing-json-with-hyphenated-key-names

【讨论】：