Question

我想在WordPress中创建打字机效果。所以我用谷歌搜索并尝试了它。按照下面的代码，

$path = __DIR__;
    wp_enqueue_script( 'typed_js', $path . '/js/define_typed.js', array('jquery') );
    wp_enqueue_script( 'typed_js', $path . '/js/typed.min.js', array('jquery') );

我这样定义了define_type.js。

var typed = new Typed('#type', {
    strings: ['Change <b>!deas</b>', 'Create WordPress <b>Themes</b>', 'Create WordPress <b>Plugins</b>', 'Do Lots Of <b>Stuff</b>'],
    typeSpeed: 100,
    backSpeed: 100,
    backDelay: 1000,
    startDelay: 1000,
    loop: true,
    });

然后我使用'type'产生效果。

<h2>We <span id="type"></span></h2>

但是它不起作用。感谢您的任何意见。

Answer 1

要做/检查的几件事：

提供您所包含的脚本具有唯一的句柄。在您的示例中，它们匹配。那是不允许的。
确保以正确的顺序加载脚本。例如，define_typed.js将取决于正在加载的Typed源代码。 wp_enqueue_script具有执行此操作的机制。
确保在DOM元素呈现后（在页脚中）后加载了这些脚本。否则，您的JavaScript将没有任何要定位的元素。同样，wp_enqueue_script允许您通过参数进行操作。

完成这些操作后，排队的代码将看起来像这样：

add_action( 'wp_enqueue_scripts', function () {
    wp_enqueue_script( 'typed_js_source', $path . '/js/typed.min.js', array(), null, true );
    wp_enqueue_script( 'typed_js_setup', $path . '/js/define_typed.js', array('typed_js_source'), null, true );
} );

我尚未对此进行测试，但是它应该向正确的方向发送信息。有关更多信息，您可以深入研究wp_enqueue_script文档：

https://developer.wordpress.org/reference/functions/wp_enqueue_script/

如何在wordpress中使用typist.js？

1 个答案: