Jquery代码获胜'不是从页脚加载运行,而是从控制台运行
Jquery code won't run loaded from footer, but run from console
我正在尝试获取一个值并将其传递给隐藏的输入,以便通过$_POST
发送表单数据。我有一个下拉按钮和以下代码,以便在用户选择选项时更新值:
jQuery(document).ready(function($) {
var espSeleccionada = $('button[data-id="select-especialidad"]');
espSeleccionada.on("click", function() {
var x = $(this).text();
$('#boton-prueba').text(x);
});
});
代码应该将值从一个按钮传递到另一个按钮,如这里的示例所示,但是,当我从WordPress页眉/页脚/主题加载代码时,什么都没有发生。相反,当我在控制台上写它时,它工作得很好。控制台中没有JS错误。
请注意,我使用.text()
来测试代码是否有效,但在上线之前它会有.val()
。
这是按钮HTML:
<button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="select-especialidad" title="Hacienda" aria-expanded="false"><span class="filter-option pull-left">Hacienda</span></button>
以下是一个示例:https://fiddle.jshell.net/t9mvoxj5/
编辑以包含完整代码:
( function( $ ) {
var num_cols = 3,
container = $('#menu-preparadores-de-oposiciones-en'),
listItem = 'li',
listClass = 'sub-list';
container.each(function() {
var items_per_col = new Array(),
items = $(this).find(listItem),
min_items_per_col = Math.floor(items.length / num_cols),
difference = items.length - (min_items_per_col * num_cols);
for (var i = 0; i < num_cols; i++) {
if (i < difference) {
items_per_col[i] = min_items_per_col + 1;
} else {
items_per_col[i] = min_items_per_col;
}
}
for (var i = 0; i < num_cols; i++) {
$(this).append($('<ul ></ul>').addClass(listClass));
for (var j = 0; j < items_per_col[i]; j++) {
var pointer = 0;
for (var k = 0; k < i; k++) {
pointer += items_per_col[k];
}
$(this).find('.' + listClass).last().append(items[j + pointer]);
}
}
});
if ($("body").hasClass("page-id-64")) {
$('.tab-content').addClass('col-sm-9');
$('#custom-tabs-0').tabCollapse();
}
} ) ( jQuery );
jQuery(document).ready(function($) {
var espSeleccionada = $('button[data-id="select-especialidad"]');
espSeleccionada.on("click", function() {
var x = $(this).text();
$('#boton-prueba').text(x);
});
});
好吧,代码很好,问题是引导选择正在使用目标button[data-id="select-especialidad"]
,即使引导选择在我的代码之前加载,处理信息也需要几秒钟(或至少一点)。
因此,应该在检查事件是否已加载的函数之后包装代码。这是最后一个代码:
$('#select-especialidad').on('loaded.bs.select', function (e) {
var y = $(this).val();
$('#select-especialidad-hidden').val(y);
var espSeleccionada = $('button[data-id="select-especialidad"] > span.filter-option.pull-left');
espSeleccionada.on("click", function() {
var x = $(this).text();
$('#select-especialidad-hidden').val(x);
});
});
loaded.bs.select here有关引导程序选择事件的更多信息。
相关文章:
- AJAX调用运行C代码的最佳实践
- 在经过一段时间或满足条件后运行代码
- 在Firefox restartless插件中,当一个新窗口打开时,我如何运行代码(监听窗口打开)
- 如果调试器关闭,Internet Explorer将出现运行代码问题
- JQuery 帖子未在 PHP 文件中运行代码
- 当ajax请求发生时运行代码的Chrome扩展
- 当我运行代码时,我得到以下结果 []对象对象] [对象对象],但应该给我一个有序数组
- 仅当客户端连接到Meteor服务器时才运行代码
- 在.each()循环中的ajax完成后,Jquery运行代码
- node.js和Cygein,我该如何运行代码
- 未访问全局变量,未运行代码
- Meteor - 在客户端上的异步回调的 for 循环后运行代码
- 运行代码以在Android应用程序中单击javascript按钮?尝试在页面上抓取回复按钮联系信息 craigslist
- 函数结束时如何运行代码
- JS 在不满足条件时在 if 语句中运行代码段
- 在 Ember 视图参数更改上运行代码
- 如何在 YUI 模块中运行代码
- 如何在未在 iframe 中定义的 iFrame 中运行代码
- 在后台运行代码,同时显示警报
- 加载页面时运行代码