如何使用内联函数调用在wordpress中调用javascript函数

How to call javascript function in wordpress using inline function call?

本文关键字：调用 javascript 函数 wordpress 何使用 函数调用      更新时间：2023-09-26

我一直在wordpress管理区域设置我的插件。我有一个存储用户信息的表单。在我的文件输入类型中，我有 javascript 函数调用我的自定义 JavaScript 并链接到它。这是一行：<li>Category Image:<input type="file" name="category[image]" id="cat_image" onchange="javascript:ImageUpload()" /></li>。但是，它返回一个错误，指出未定义的函数ImageUpload()，肯定无法找到该函数。我在想的是，也许有一个wordpress函数可以调用这个，或者我需要先设置吗？但是我已经链接了我的自定义js并且它正在工作。问题是如何在管理区域中从我的wordpress php文件中调用某些js函数？我希望你们明白这一点。谢谢。这是我的代码：

plugin_file.php

 <form method="post" name="new_category" id="product_category" enctype="multipart/form-data"> 
 <ul class="add_prod">
 <li>Category Title:<input type="text" name="category[title]" id="cat_title" value="" placeholder="Title" /> </li>
 <li>Category Description:<textarea rows="4" cols="40" name="category[description]"></textarea></li>
 <li>Category Image:<input type="file" name="category[image]" id="cat_image" onchange="javascript:ImageUpload()" /></li>
 <li><input type="submit" name="submit" id="submit" value="Submit details" class="btn-submit"/></li>
 </ul>  
 </form>

js 文件：

function ImageUpload() {
    $("#return").show();
    $("#return").html('');
    $("#return").html('<img src="images/load2.gif" alt="Uploading...."/> wait, uploading...');
    $("#imageform").ajaxForm({
        target: '#return',
        success: function() {
            $("#return").fadeOut(10000);
        }
    }).submit();

}

确保在调用 之前加载了 js 文件。

你可以做这样的事情 

<?php
    add_action('wp_head','js_call'); // make sure js is loaded in head
    function js_call() {  ?>
    <script>
    function ImageUpload() {
        jQuery("#return").show();
        jQuery("#return").html('');
        jQuery("#return").html('<img src="images/load2.gif" alt="Uploading...."/> wait, uploading...');
        jQuery("#imageform").ajaxForm({
            target: '#return',
            success: function() {
                jQuery("#return").fadeOut(10000);
            }
        }).submit(); 

    </script>
<?php    } ?>
相关文章：