jQuery-选择框更改时URL不更新

Question

I have a Ajax query that changes content based on a drop down. The query works as it should but I cannot get it to update the URL with the select. If I select an item the content displays as it should but no URL change. If I enter the URL manually it shows the content as it should.

Am I missing something to get it to change the URL?

$(document).ready(function(){
if($('.ID :selected').val()) {$('.ID').show();} else {$('.ID').hide();}  ;

$('.Name').change(function(e){
e.preventDefault();     
   var myval = $('.Name:selected').val();
   var baseurl = window.location.origin+window.location.pathname+"?ID="+myval;
    $.ajax(baseurl)
        .done(function (response) {
            $('body').html(response);
            $('.ID').show();
        })
        .fail (function (xhr) {
            alert('Error: ' + xhr.responseText);
            $('.ID').hide();
    });    
 });    
});

EDIT - I am using Silverstripe CMS. I have an SQL query that populates from the DB

$form = Form::create(
    $this,'MySearchForm',
    FieldList::create(
    DropdownField::create('ID',' ')
        ->setSource(TableName::get()->map('ID','MainName'))
        ->setemptyString('--Select Level --')
        ->addExtraClass('Name')
        ),

    FieldList::create());

    $form->setFormMethod('GET')
    ->setFormAction($this->Link()."#programme")
    ->disableSecurityToken()
    ->loadDataFrom($this->request->getVars());

    if($request->isAjax()) {
      $this->renderWith('Search');
    }

Answer 1

The problem is in your code, while getting the value syntax, I believe there is no need to use :selected with the val() . You can use $('.ID').val() instead of $('.ID :selected').val()

In addition to use this :selected you should follow this syntax $('.ID option:selected')

Hope This might be helpfull for you !!