विभिन्न जीईटी पैरामीटर

Question

के साथ गतिशील रूप से छवि लोड करें मैं jQuery के साथ एक छवि (PHP के साथ बनाया गया) लोड करने और इसके साथ कुछ चर पारित करने की कोशिश कर रहा हूं (उदाहरण के लिए: picture.php?user=1&type=2&color=64)। यह आसान हिस्सा है।

कठिन हिस्सा यह है कि मेरे पास एक ड्रॉपडाउन है जो मुझे पृष्ठभूमि (प्रकार पैरामीटर) चुनने में सक्षम बनाता है और मेरे पास रंग चुनने के लिए एक इनपुट होगा।

Here're समस्याओं का सामना करना पड़ रहा हूँ:

1. एक ड्रॉपडाउन/इनपुट को छुआ नहीं किया गया है, मैं इसे URL से छोड़ना चाहते हैं।
2. यदि कोई ड्रॉपडाउन/इनपुट स्पर्श किया गया है, तो मैं इसे यूआरएल में शामिल करना चाहता हूं। (यह पूर्व-मौजूदा स्ट्रिंग में केवल एक चर "&type=2" जोड़कर काम नहीं करेगा जैसे कि मैं ड्रॉपडाउन/इनपुट को कई बार स्पर्श करता हूं (&type=2&type=2&type=3))।
3. पूर्व-मौजूदा यूआरएल में एक चर ("&type=2" - नीचे दिया गया कोड देखें) जोड़ते समय &-हस्ताक्षर गायब हो जाता है (यह इस तरह बन जाता है: "signature.php?user=1type=2")।

   <script> 
       var url = "signatureload.php?user=<?php echo $_SESSION['sess_id']; ?>"; 
   
       $(document).ready(function() { 
        window.setTimeout(LoadSignature, 1500); 
       }); 
   
       $("#signature_type").change(function() { 
        url += "&type="+$(this).val(); 
   
        LoadSignature(); 
       }); 
   
       function LoadSignature() 
       { 
        $("#loadingsignature").css("display", "block"); 
        $('#loadsignature').delay(4750).load(url, function() { 
         $("#loadingsignature").css("display", "none"); 
        }); 
       } 
   </script> 
   

   यहाँ कोड है जहाँ मैं छवि को लोड है::

   <div id="loadsignature"> 
       <div id="loadingsignature" style="display: block;"><img src="img/loading-black.gif" alt="Loading.."></div> 
   </div> 
   

   मैं नहीं जानता कि मैं और अधिक आगे कैसे कर सकता

यहाँ jQuery के लिए कोड है मेरी समस्या की व्याख्या करो। अगर आपको कोई संदेह है या आपको अधिक कोड चाहिए, तो कृपया मुझे बताएं।

आपकी मदद के लिए धन्यवाद!

संपादित करें:

<script> 
    var url = "signatureload.php?user=<?php echo $_SESSION['sess_id']; ?>"; 

    $(document).ready(function() { 

     window.setTimeout(LoadSignature, 1500); 

    }); 

    $("#signature_type").change(function() { 
     url = updateQueryStringParameter(url, 'type', $(this).val()); 

     LoadSignature(); 
    }); 

    function LoadSignature() 
    { 
     $("#loadingsignature").css("display", "block"); 
     $('#loadsignature').delay(4750).load(url, function() { 
      $("#loadingsignature").css("display", "none"); 
     }); 
    } 

    function updateQueryStringParameter(uri, key, value) 
    { 
     var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i"), 
     separator = uri.indexOf('?') !== -1 ? "&" : "?", 
     returnUri = ''; 

     if (uri.match(re)) 
     { 
      returnUri = uri.replace(re, '$1' + key + "=" + value + '$2'); 
     } 
     else 
     { 
      returnUri = uri + separator + key + "=" + value; 
     } 

     return returnUri; 
    } 
</script> 

EDIT2::

यहाँ वर्तमान कोड है

यहाँ signatureload.php के लिए कोड है

<?php 
    $url = "signature.php?"; 

    $count = 0; 
    foreach($_GET as $key => $value) 
    { 
     if($count > 0) $url .= "&"; 
     $url .= "{$key}={$value}"; 
    } 

    echo "<img src='{$url}'></img>"; 
?> 

Answer 1

यहाँ एक संस्करण है जहां सभी डेटा एक अलग जावास्क्रिप्ट सरणी

<script> 
    var baseurl = "signatureload.php?user=<?php echo $_SESSION['sess_id']; ?>"; 
    var urlparams = {}; 

    $(document).ready(function() { 
     window.setTimeout(LoadSignature, 1500); 
    }); 

    $("#signature_type").change(function() { 
     urlparams['type'] = $(this).val(); 

     LoadSignature(); 
    }); 

    function LoadSignature() 
    { 
     var gurl = baseurl; // there is always a ? so don't care about that. 
     for (key in urlparams) { 
      gurl += '&' + encodeURIComponent(key) + '=' + encodeURIComponent(urlparams[key]); 
     } 

     $("#loadingsignature").css("display", "block"); 
     $('#loadsignature').delay(4750).load(gurl, function() { 
      $("#loadingsignature").css("display", "none"); 
     }); 
    } 
</script> 

0 में रखा गया है

इस रंग या किसी अन्य पैरामीटर के साथ urlparams['color'] = $(this).val();

Answer 2

अगर मैं अंडर अपने प्रश्न को सही ढंग से टोड करें, यह जावास्क्रिप्ट/jQuery का उपयोग कर वर्तमान यूआरआई के जीईटी पैरामीटर को संशोधित करने का एक उचित तरीका खोजने के लिए नीचे आता है, है ना? जैसा कि आप बताते हैं कि सभी समस्याएं type पैरामीटर के मान को बदलने से आती हैं।

हालांकि यह प्रतीत नहीं होता है कि यह नौकरी के लिए जावास्क्रिप्ट प्लगइन्स भी हो सकता है। आप this की तरह है और अपने signature_type परिवर्तन घटना श्रोता में

function updateQueryStringParameter(uri, key, value) { 
    var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i"), 
     separator = uri.indexOf('?') !== -1 ? "&" : "?", 
     returnUri = ''; 

    if (uri.match(re)) { 
     returnUri = uri.replace(re, '$1' + key + "=" + value + '$2'); 
    } else { 
     returnUri = uri + separator + key + "=" + value; 
    } 

    return returnUri; 
} 

$('#signature_type').change(function() { 

    // Update the type param using said function 
    url = updateQueryStringParameter(url, 'type', $(this).val()); 

    LoadSignature(); 
}); 

Answer 3

एक समारोह इस्तेमाल कर सकते हैं, तुम क्यों एक चर में अपनी चुनी मूल्य भंडारण, और फिर AJAX के पद डेटा और लोड छवि का उपयोग कर की कोशिश नहीं करते। इस तरह आप सुनिश्चित करते हैं कि केवल एक चर है, दोहराए नहीं।यहाँ उदाहरण

var type= 'default_value'; 

    $("#signature_type").change(function() {   
     type = $(this).val(); 
    }); 

है तो (यदि आप अपने "परिवर्तन" घटना समारोह में ऐसा कर सकता है) इस तरह इसे कहते ajax का उपयोग कर: हो सकता है कुछ इस तरह

$.ajax({ 
    type: 'GET', 
    url: 'signatureload.php', 
    data: { 
     user: <?php echo $_SESSION['sess_id']; ?>, 
     type: type, 
     ... put other variables here ... 
    }, 
    success: function(answer){ 
     //load image to div here 
    } 
}); 

Answer 4

:

<script> 
    var baseUrl = "signatureload.php?user=<?php echo $_SESSION['sess_id']; ?>"; 

    $(document).ready(function() { 
     window.setTimeout(function(){ 
      LoadSignature(baseUrl); 
     }, 1500); 
    }); 

    $("#signature_type").change(function() { 
     var urlWithSelectedType = baseUrl + "&type="+$(this).val(); 
     LoadSignature(urlWithSelectedType); 
    }); 

    function LoadSignature(urlToLoad) 
    { 
     $("#loadingsignature").css("display", "block"); 
     $('#loadsignature').delay(4750).load(urlToLoad, function() { 
      $("#loadingsignature").css("display", "none"); 
     }); 
    } 
</script>