Question

我正在使用Semantic-UI并在其中有一个带有输入字段的弹出窗口（搜索字段）。弹出窗口已初始化/打开＆＃34; on：＆＃39;点击＆＃39;＆＃34;，但我想在用户打开弹出窗口之前使用javascript为输入字段设置一个值。

尝试使用

document.getElementById("sok_tekst").value = input;

只会导致

未捕获的TypeError：无法设置属性＆＃39; value＆＃39;为null

当我查看控制台时，我发现HTML代码包含带有输入字段的弹出窗口（id =＆＃34; sok_tekst＆＃34;），但它看起来像我＆＃34;可以＆＃39;达到它＆＃34;用javascript进行初始化。

我觉得我已经尝试了所有内容，看起来我需要在向输入字段添加值之前打开弹出窗口。

这是DEMO

有没有人为此做过伎俩？

谢谢！

对于好奇：我使用输入字段作为表/工作计划中的搜索字段。重绘表时，通过用户更改周数，弹出窗口也会重新绘制。我试图保留搜索值，并将其放回输入字段，新弹出窗口中的新表中。

Answer 1

为了初始化输入值，您不应该使用data-html="..."指定弹出内容，这不会让值更改因为尚未创建输入（这就是为什么你＆＃39; re getting无法设置属性＆＃39; of null），因此应该从预先存在的HTML内容中更改它，因此请在弹出设置中使用popup: $('#YourContentSelector'),来设置然后，您可以使用以下内容更改输入值：$('#input_test').val('test');，如下所示：

<强> HTML：

<!-- Popup Button -->
<i class="search link icon sok"></i>
<!-- Popup Button -->

<!-- Popup Content -->
<div class='ui form popup hidden' id="content"><!-- hidden class added so it won't be shown when it's loaded   -->
    <div class='field'>
        <div class='ui icon input'>
            <input type='text' placeholder='Input' id='input_test'>
            <i class='search icon'></i>
        </div>
    </div>
</div>
<!-- Popup Content -->

<强> JS（jQuery的）

$(document).on('click', '.search.sok', function() {
  $('#input_test').val('test');
    $(this)
       .popup({
           popup: $('#content'),
            on:'click'
       })
       .popup('show');

});

这是一个有效的Demo

Docs

语义UI弹出 - 在初始化

1 个答案: