JQuery 无法获取 textarea 的值

Question

我知道这是一个常见问题，我尝试了所有找到的解决方案。

无论如何，似乎没有任何效果。

我也尝试使用val()、text() 和html() 来获取值，正如有人建议的那样：NOTHING！

这是我的 HTML（我们在 Wordpress 中）：

<div class="row">
    <div class="three columns">
        <?php _e( 'Content:', 'helpy'); ?>
    </div>
    <div class="nine columns">
        <textarea id="new_task_content" class="helpy-textarea" placeholder="<?php _e( 'Place the content here...', 'helpy'); ?>"></textarea>
    </div>
</div>
<div class="row">
    <div class="three columns">
        <?php _e( 'Due date:', 'helpy'); ?>
    </div>
    <div class="nine columns">
        <input type="date" id="new_task_due" class="helpy-date-input" value="<?php echo date('Y-m-d'); ?>">
    </div>
</div>
<div class="row">
    <div class="twelve columns">
        <button type="button" id="new_task" class="button-helpy"><?php _e( 'Confirm', 'helpy'); ?></button>
    </div>
</div>

还有 JS：

$('#new_task').live('click', function() {
    var task_due = $('#new_task_due').val();
    var task_content = $('#new_task_content').val();
    console.log(task_content);
    console.log(task_due);
    /* var data = {
        action: 'project_request',
        task_content: task_content,
        task_due: task_due,
        id: '<?php echo $_GET['id']; ?>',
        todo: 'task',
    };

    $.ajax({
        type: "POST",
        url: ajaxurl,
        data: data,
        dataType: 'JSON',
        success: function(response) {
            $('#response').fadeIn(300, function(){ $(this).html(response.confirm); });
            setTimeout(function() {
                $('#response').fadeOut(300, function(){ $(this).empty();});
            }, 5000);
        },
    });*/
});

整个JS都在jQuery(document).ready(function($){}里面。

一开始以为是WP Ajax的问题​​，后来发现变量“task_content”其实根本没有贴出来，console里除了“task_due”值外什么也没有出现。

这是我看不到的错字吗？

我从我的应用程序的另一个页面克隆了 JS 和 HTML，它运行良好。我不明白问题出在哪里！

编辑：

HTML 包含在一个对话窗口中，这是一种类似于 Bootstrap 的模式。

所以我改变了这样的按钮：

<button type="button" onclick="createNewTask('<?php echo $_GET['id']; ?>');" id="new_task" class="button-helpy"><?php _e( 'Confirm', 'helpy'); ?></button>

还有JS函数：

function createNewTask(id) {
var task_due = jQuery('#new_task_due').val();
var task_content = jQuery('#new_task_content').val();
console.log(task_content);
console.log(task_due);
/* var data = {
    action: 'project_request',
    task_content: task_content,
    task_due: task_due,
    id: id,
    todo: 'task',
};

jQuery.ajax({
    type: "POST",
    url: ajaxurl,
    data: data,
    dataType: 'JSON',
    success: function(response) {
        jQuery('#response').fadeIn(300, function(){ jQuery(this).html(response.confirm); });
        setTimeout(function() {
            jQuery('#response').fadeOut(300, function(){ jQuery(this).empty();});
        }, 5000);
    },
});*/

}

结果是一样的:(

Answer 1

我不知道你有什么问题，这里的小提琴正常工作：https://jsfiddle.net/py5scvhm/

顺便说一句，而不是 .live() 使用 .on() 因为 .live() 已弃用 http://api.jquery.com/live/

Answer 2

好吧，在尝试了几乎所有方法之后，我决定将 textarea 插入到引导模式中。

不知何故，旧对话框的 js 代码阻止了值的读取。我没有弄清楚为什么以及它的哪一部分，但问题肯定存在。

感谢大家帮助我！

Answer 3

而不是

$('#new_task_content').val();

尝试使用获得价值

$('textarea#new_task_content').val();

也在控制台中调试并检查对象是什么

$('#new_task_content')