JQuery是一個高效性和跨瀏覽器的JavaScript庫，被廣泛應用于Web開發中，主要幫助我們通過簡單的方法來處理DOM，處理事件，執行動畫效果等。在JQuery中，設置模態框的寬度非常簡單，只需按照以下步驟進行操作。

第一步，在HTML文檔中創建一個模態框的基本結構，例如:

<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">模態框標題</h4>
</div>
<div class="modal-body">
<p>模態框內容</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">關閉</button>
</div>
</div>
</div>
</div>

第二步，使用JQuery代碼來設置模態框的寬度。例如，要將模態框的寬度設置為500像素，可以使用以下代碼：

$(document).ready(function(){
$('#myModal').on('show.bs.modal', function (e) {
$(this).find('.modal-dialog').css({
'width':'500px'
});
});
});

在這個代碼中，我們可以看到我們對模態框中的.modal-dialog元素進行了選擇，并通過CSS方法設置了寬度為500像素。可以根據需要設置合適的寬度值。

總之，使用JQuery設置模態框的寬度非常簡單。只需按照上述步驟進行操作，即可輕松地設置模態框的樣式，讓它更好地適應我們的需求。希望這篇文章能夠對您有所幫助！