Question

我想知道如何在mysql数据库中以复选框的形式搜索用户提供的输入。但在此之前，我需要将已检查的字段放入javascript数组/字符串中，以便我可以使用url将其传递给PHP。

<form>
    <input type="checkbox" id="interests" name="interests" value="Food">`
    <input type="checkbox" id="interests" name="interests" value="Movies">`
    <input type="checkbox" id="interests" name="interests" value="Music">`
    <input type="checkbox" id="interests" name="interests" value="Sports">`
</form>

我可以使用上面的其他表单元素，如文本和选择输入，但不知道如何为复选框执行此操作。请帮忙。感谢

Answer 1

而不是

<form> 
<input type="checkbox" id="interests" name="interests[]" value="Food"> 
<input type="checkbox" id="interests1" name="interests[]" value="Movies"> 
<input type="checkbox" id="interests2" name="interests[]" value="Music"> 
<input type="checkbox" id="interests3" name="interests[]" value="Sports">

将名称属性从interests更改为interests[] 应该解决你的问题。如果我对该属性的错误，我很抱歉，有点用PHP练习，但我很确定。无需使用javascript做任何事情。这种方式更容易。当然，如果你不想轻松......

关于通过数据库搜索它的第一个问题，我不明白为什么你需要？如果它是一个复选框，你确切地知道它应该是什么，所以就这样把它插入数据库就像这样：

INSERT INTO your_table values(user_id_i_guess, interests...);

你明白了吗？

Answer 2

代码中的问题

不要对多个元素使用相同的id
将复选框的名称更改为interests[]

<强>的jQuery

var vals = [];

$(':checkbox:checked[name^=interests]').val(function() {
   vals.push(this.value);
});

如果要将数组转换为逗号分隔的字符串，请尝试

val.join(',');

注意

$(':checkbox:checked[name^=interests]')选择器选中所有选中的复选框，name以interests开头。

Answer 3

您必须为复选框使用不同的ID（元素的ID必须唯一）
为复选框interest []和提交表单命名 - 在服务器上你可以使用数组$ _POST ['interest']或$ _GET ['interest']

Answer 4

假设您的表单有一个名称，

var c = [],
    els = document.forms.formName.elements,
    len = els.length;

for ( var i = 0; i < length; i++ ) {

    if ( els[ i ].type === 'checkbox' ) {

        // If you want to add only checked checkboxes, you can use:
        if ( els[ i ].checked ) c.push( els[ i ].value );

        // If you don't care, just use:
        c.push( els[ i ].value );
    }
}

console.log( c ); // Array of the checkboxes values

如果您不关心旧版浏览器，可以使用map来获得更清晰的代码：

var c = [].map.call( document.forms.formName.elements, function( el ) {
    if ( el.type === 'checkbox' ) {
        if ( el.checked ) return el.value;
    }
} );

如果你有jQuery，这里有一些codez：

var c = $( ':checkbox:checked' ).map( function() {
    return $( this ).val();
} );

console.log( c ); // Array of the checkboxes values

// To be more precise (so, more performant), you can use the following selector:
$( ':checkbox:checked', document.forms.formName.elements )

如何在复选框中收集选中的值作为javascript数组/字符串？

4 个答案:

代码中的问题

注意