我对Amazon MTurk的html布局有一个奇怪的问题。当使用AWS的人群元素时,<form>下有意外的空间。

这是一段演示代码:

<script src="https://assets.crowd.aws/crowd-html-elements.js"></script>

<crowd-form answer-format="flatten-objects">
    <div>
        <form>
            <p> Some random question</p>
            <input type="radio" name="q-1" value="1"> <label>Choice1</label>
            <br>
            <input type="radio" name="q-1" value="2"> <label>Choice2</label>
            <br>
            <input type="radio" name="q-1" value="3"> <label>Choice3</label>
        </form>
     </div>
<p> Some random text to test the space after `form` </p>
</crowd-form>



会产生一个带有大量空格的多项选择题(第二张图片紧接在第一个图片之后-但由于空间太长,我不得不截取两个单独的图片)。

javascript - 使用Mechanical Turk的人群html元素的&lt;form&gt;下的意外空间-LMLPHP
javascript - 使用Mechanical Turk的人群html元素的&lt;form&gt;下的意外空间-LMLPHP

但是,当注释掉人群html行时,一切似乎都很好:

<!--<script src="https://assets.crowd.aws/crowd-html-elements.js"></script>-->

<crowd-form answer-format="flatten-objects">
    <div>
        <form>
            <p> Some random question</p>
            <input type="radio" name="q-1" value="1"> <label>Choice1</label>
            <br>
            <input type="radio" name="q-1" value="2"> <label>Choice2</label>
            <br>
            <input type="radio" name="q-1" value="3"> <label>Choice3</label>
        </form>
     </div>
<p> Some random text to test the space after `form` </p>
</crowd-form>


会产生以下结果:

javascript - 使用Mechanical Turk的人群html元素的&lt;form&gt;下的意外空间-LMLPHP

有谁知道为什么会这样,如果我仍然想使用人群形式,该如何解决呢?谢谢!

最佳答案

您应该省略<form>元素。

<crowd-form>为您处理所有表单提交。

您需要包括(而不是注释掉)Crowd HTML Elements脚本导入:

<script src="https://assets.crowd.aws/crowd-html-elements.js"></script>


希望这可以帮助。

如果您还有其他问题,请告诉我。

谢谢,

亚马逊机械特克

关于javascript - 使用Mechanical Turk的人群html元素的<form>下的意外空间,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58299602/

10-09 14:16