Send an array from a select to a URL using ajax

I have a problem that I'm having a hard time resolving even though it looks easy, and it would look like this:

I have this select array:

<select id="cidade" onchange="fLoadBairro();"  class="search-box__combo" multiple name="cidade[]">
    <option value="0" id="cidade">Cidade</option>
    <optgroup label="Cidades">

        <?php 
        $sql = $MySQLi->query("SELECT id, cidade, uf FROM cidades ORDER BY cidade ASC");
        while( $linha_1 = mysqli_fetch_array( $sql ) )

        echo '<option value="'.$linha_1['id'].'">' .$linha_1['cidade'].'/'.$linha_1['uf'].'</option>';

        ?>

    </optgroup>
</select>

Note that in the name:cidade[] tag, even many know.

Now this is my ajax:

////FUNCAO PRA CRIAR AJAX
function createXMLHTTP() {
    var ajax;
    try {
        ajax = new ActiveXObject("Microsoft.XMLHTTP");
    } catch(e) {
        try {
            ajax = new ActiveXObject("Msxml2.XMLHTTP");
            alert(ajax);
        } catch(ex) {
            try {
                ajax = new XMLHttpRequest();
            } catch(exc) {
                 alert("Esse browser não tem recursos para uso do Ajax");
                 ajax = null;
            }
        }
        return ajax;
    }

    var arrSignatures = ["MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0",
                            "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP",
                            "Microsoft.XMLHTTP"];
    for (var i=0; i < arrSignatures.length; i++) {
        try {
            var oRequest = new ActiveXObject(arrSignatures[i]);
            return oRequest;
        } catch (oError) { 
        }
    }
    throw new Error("MSXML is not installed on your system.");
}

function ChamaAJAXDIV3(xDiv, xPagina, xVariaveis){
    var combo = createXMLHTTP();
    combo.open("post", xPagina, true);
    combo.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    combo.onreadystatechange=function(){
        if (combo.readyState==4){
            document.getElementById(xDiv).innerHTML = unescape(combo.responseText.replace(/\+/g," "));
        }
    }
    combo.send(xVariaveis);
    alert(fVariavel);
}

And lastly it would be the Ajax function that requests the URL:

var $cidade = jQuery('form'),
data = $cidade.serialize();
function fLoadBairro(xDIV){
    with(document.busca){               
        ChamaAJAXDIV3("div_PesqBairros", "combo_cidades.php?id="+data);
    }
}       
alert(+data);

In this function, I tried to get the array from the cidade[] tag, and I'm not getting it, but if I take the vectors of the tag name city and put it as ciudad.value, it will only get the first value of the tag value selected from the list.

I need to get these values from these selected values and send them as array, or rather there in the URL instead of going like this: combo_cidades.php?id=1 , would like this: combo_cidades.php?id=1,2,3 , if 3 checkboxes of my select .

I use the MULT-SELECT function which creates checkboxes within the selects that everyone knows.

SUMMARY: I need to inside select when I open it, and select 3 checkbok with its values in the values, for example: value: with id 1, value: with id 2, value: with id 3, get and pass through URL for me in PHP to use an explode and a foreach and separate them, then you may ask why all this is that I want to apply this in a COMBO BOX and need this return by PHP to generate the neighborhoods of each id selected in the tag city, since I am grateful and sorry for the giant text, it is to be more enlightened ..